RadComboBox Selected Value Issue

[Muhammad]

Hi,
I am novice to telerik and getting some problem in radcombobox. my scenario is:
- A RadPanelBar
- A RadPanelItem inside the RadPanelBar
- In ItemTemplate of RadPanelItem, I have a RadGrid having columns for Institution, Grade, Degree.
- Inside RadGrid, I've a FormTemplate in which i've place text fields for Institution and Grade and a RadComboBox for Degree (MBA, BBA, etc. fetching from DB).
- My DB design is as I've a Candidate table in which there is a column for Degree (of number type, a foriegn key for my Degrees table).
- I want to show in my RadGrid the Institution, Grade, and Degree_Name (MBA, BBA, etc.), But i cannot understand how to achieve this.
- Another problem is that I am unable to use the selectedValue of RadComboBox.

Please refer to my code snippet.

 

<telerik:RadPanelItem runat="server" Text="Step 5: Qualification >>>">

<Items>

<telerik:RadPanelItem runat="server" Value="QualificationItem">

<ItemTemplate>

<div id="QualificationDetail" class="CVPanelGrid" >

<telerik:RadGrid ID="QualificationGrid" runat="server" AutoGenerateColumns="False"

CellSpacing="0" GridLines="None" Skin="Web20"

ondeletecommand="QualificationGrid_DeleteCommand"

oninsertcommand="QualificationGrid_InsertCommand"

onneeddatasource="QualificationGrid_NeedDataSource"

onprerender="QualificationGrid_PreRender"

onupdatecommand="QualificationGrid_UpdateCommand"

onitemdatabound="QualificationGrid_ItemDataBound">

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default">

</HeaderContextMenu>


<MasterTableView CommandItemDisplay="Top" EditMode="PopUp" EditFormSettings-EditColumn-CancelImageUrl="images/CancelRecord.gif" EditFormSettings-EditColumn-InsertImageUrl="images/InsertRecord.gif" EditFormSettings-EditColumn-ButtonType="ImageButton" DataKeyNames="PKEY" AllowAutomaticInserts="False">


<CommandItemSettings ExportToPdfText="Export to PDF" AddNewRecordText="Add Qualification" ShowAddNewRecordButton="true" ShowRefreshButton="false" >


</CommandItemSettings>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

<HeaderStyle Width="20px" />

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

<HeaderStyle Width="20px" />

</ExpandCollapseColumn>


<Columns>

<telerik:GridBoundColumn FilterControlAltText="Filter PKey column"

UniqueName="PKey" DataField="PKEY" HeaderText="PKey" HeaderStyle-Width="250" Visible="false">

<HeaderStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>


<telerik:GridBoundColumn FilterControlAltText="Filter Institute column"

UniqueName="Institute" DataField="INSTITUTION" HeaderText="Institute" HeaderStyle-Width="250">

<HeaderStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>


<telerik:GridBoundColumn FilterControlAltText="Filter Degree column"

UniqueName="Degree" DataField="NAME" HeaderText="Degree" HeaderStyle-Width="150">

<HeaderStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>


<telerik:GridBoundColumn FilterControlAltText="Filter CompletionYear column" DataFormatString ="{0:yyyy}"

UniqueName="CompletionYear" DataField="COMPLETION_YEAR" HeaderText="Year of Completion" HeaderStyle-Width="100">

<HeaderStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>


<telerik:GridBoundColumn FilterControlAltText="Filter Major column"

UniqueName="Major" DataField="MAJOR" HeaderText="Major" HeaderStyle-Width="150">

<HeaderStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>


<telerik:GridBoundColumn FilterControlAltText="Filter Grade column"

UniqueName="Grade" DataField="GRADE" HeaderText="Grade" HeaderStyle-Width="150">

<HeaderStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>


<telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn" HeaderStyle-Width="15px">

<HeaderStyle Width="15px" />

<ItemStyle HorizontalAlign="Center" />

</telerik:GridEditCommandColumn>

<telerik:GridButtonColumn UniqueName="DeleteColumn" ButtonType="ImageButton" CommandName="Delete" HeaderStyle-Width="15px">

<HeaderStyle Width="15px" />

<ItemStyle HorizontalAlign="Center" />

</telerik:GridButtonColumn>

</Columns>

<EditFormSettings CaptionFormatString="Qualification Details" PopUpSettings-Modal="true" EditFormType="Template" PopUpSettings-Width="480px" >

<FormTemplate>

<div id="QualificationForm" >

<ul ID="QualificationInfo" class="formModalList">

<li>

<asp:Label ID="Label24" runat="server" CssClass="CVtextLabel" Text="Institution:"

Width="120px"></asp:Label>

<asp:TextBox ID="txtInstitute" Text= '<%# Bind("INSTITUTION") %>' runat="server" CssClass="CVtextInput"></asp:TextBox>

</li>

<li>

<asp:Label ID="Label25" runat="server" CssClass="CVtextLabel"

Text="Degree:" Width="120px"></asp:Label>

<telerik:RadComboBox ID="cmbDegree" runat="server" Skin="Web20">

</telerik:RadComboBox>

</li>

<li>

<asp:Label ID="Label26" runat="server" CssClass="CVtextLabel"

Text="Year of Completion:" Width="120px"></asp:Label>

<telerik:RadMonthYearPicker ID="txtCompletionYear" Runat="server"

Culture="English (United States)" EnableTyping="False" Skin="Web20"

DbSelectedDate='<%# Bind ("COMPLETION_YEAR") %>'>

<DatePopupButton HoverImageUrl="" ImageUrl=""

ToolTip="Open the year view popup." />

<DateInput DateFormat="yyyy" DisplayDateFormat="yyyy" ReadOnly="True" runat="server">

</DateInput>

</telerik:RadMonthYearPicker>

</li>


<li>

<asp:Label ID="Label20" runat="server" CssClass="CVtextLabel" Text="Major:"

Width="120px"></asp:Label>

<asp:TextBox ID="txtMajor" Text= '<%# Bind("MAJOR") %>' runat="server" CssClass="CVtextInput"></asp:TextBox>

</li>


<li>

<asp:Label ID="Label22" runat="server" CssClass="CVtextLabel" Text="Grade:"

Width="120px"></asp:Label>

<asp:TextBox ID="txtGrade" Text= '<%# Bind("GRADE") %>' runat="server" CssClass="CVtextInput"></asp:TextBox>

</li>


<li class="lastListItem">

<telerik:RadButton ID="BtnAddQualification" runat="server" Text='<%# IIf (TypeOf Container is GridEditFormInsertItem, "Insert", "Update") %>'

Skin="Web20" Width="50px" CssClass="btnInsertItem"

CommandName='<%# IIf (TypeOf Container is GridEditFormInsertItem, "PerformInsert", "Update") %>'>

</telerik:RadButton>

<telerik:RadButton ID="BtnCancelQualification" runat="server" Text="Cancel"

Skin="Web20" Width="50px" CssClass="btnCancelItem" CommandName="Cancel"

>

</telerik:RadButton>

</li>

</ul>

</div>

</FormTemplate>



<FormTableButtonRowStyle HorizontalAlign="Right" />

<EditColumn FilterControlAltText="Filter EditCommandColumn column">


</EditColumn>

<PopUpSettings Modal="True" Width="480px" />

</EditFormSettings>

</MasterTableView>

<FilterMenu EnableImageSprites="False">

</FilterMenu>




</telerik:RadGrid>

<br />

</div>

</ItemTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

Here you can see that I've not bind my cmbDegree combobox with the DB. I am performing this task in code.

 

 

 

Protected Sub QualificationGrid_ItemDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs)
        If TypeOf e.Item Is GridEditFormItem And e.Item.IsInEditMode Then
            Dim editedItem As GridEditFormItem = CType(e.Item, GridEditFormItem)
            Dim cmbDegree As RadComboBox = editedItem.FindControl("cmbDegree")

            Dim srv As New PICT.Web.Services.Careers.CareersClient
            Dim dSet As Global.PICT.Web.CVDataSet = srv.GetDegrees()

            cmbDegree.DataSource = dSet.Degree
            cmbDegree.DataTextField = "NAME"
            cmbDegree.DataValueField = "PKEY"
            cmbDegree.DataBind()
        End If
    End Sub

The above code sets the data source of cmbDegree and correctly shows when i add new record in the grid through Pop-up modal box. But when i hit insert button, the selected value of combo box not saved in my datatable and not reflect in my grid. (Remember i want to show the Degree Name in the grid, not the selectedvalue of combo.)

Kindly help me out in this matter.

Regards,
Ovais

[Princy]

Hello Muhammad,

After inspecting your code I am not quite sure about your requirement.
For second scenario, check the following help documentation which explains how to get the SelectedValue for a RadComboBox.
SelectedIndexChanged.

Thanks,
Princy.

[Muhammad]

OK, let me try to make it simple.
RadComboBox is binded to database through Grid's ItemDataBound method.

Protected Sub QualificationGrid_ItemDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs)
        If TypeOf e.Item Is GridEditFormItem And e.Item.IsInEditMode Then
            Dim editedItem As GridEditFormItem = CType(e.Item, GridEditFormItem)
            Dim cmbDegree As RadComboBox = editedItem.FindControl("cmbDegree")

            Dim srv As New PICT.Web.Services.Careers.CareersClient
            Dim dSet As Global.PICT.Web.CVDataSet = srv.GetDegrees()

            cmbDegree.DataSource = dSet.Degree
            cmbDegree.DataTextField = "NAME"
            cmbDegree.DataValueField = "PKEY"
            cmbDegree.DataBind()
        End If
    End Sub

In aspx,

<telerik:RadComboBox ID="cmbDegree" runat="server" Skin="Web20"
Text='<%# Bind("DEGREE_NAME") %>' SelectedValue='<%# Bind("DEGREE") %>'>
</telerik:RadComboBox>

The above code is not executing and throwing error that "Databinding methods such as Eval(), XPath(), and Bind() can only be used in the context of a databound control." What does this mean?

I've tried this without databindings by populating items like

<telerik:RadComboBox ID="cmbDegree" runat="server" Skin="Web20"
Text= '<%# Bind("DEGREE_NAME") %>' SelectedValue='<%# Bind("DEGREE") %>'>
<Items>
<telerik:RadComboBoxItem runat="server" Text="MBA" Value="1" />
<telerik:RadComboBoxItem runat="server" Text="BBA"
Value="2" />
<telerik:RadComboBoxItem runat="server" Text="MS"
Value="3" />
</Items>
</telerik:RadComboBox>

and this works fine.. What is wrong with databindings??

Ovais.

[Princy]

Hello Muhammad,

Try setting the selected value of RadComboBox from server side as shown below.
VB:

Protected Sub QualificationGrid_ItemDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs)
        If TypeOf e.Item Is GridEditFormItem And e.Item.IsInEditMode Then
            Dim editedItem As GridEditFormItem = CType(e.Item, GridEditFormItem)
            Dim cmbDegree As RadComboBox = editedItem.FindControl("cmbDegree")
  Dim srv As New PICT.Web.Services.Careers.CareersClient
            Dim dSet As Global.PICT.Web.CVDataSet = srv.GetDegrees()
            cmbDegree.DataSource = dSet.Degree
            cmbDegree.DataTextField = "NAME"
            cmbDegree.DataValueField = "PKEY"
            cmbDegree.SelectedValue = "DEGREE";
            cmbDegree.DataBind()
        End If
    End Sub

Thanks,
Princy

[Muhammad]

I've tried and got the following error on this line: "Selection out of range Parameter name: value"
cmbDegree.DataBind()

When i tried to comment the above line of code, combobox does not populate with data.

[Jayesh Goyani]

hi,

cmbDegree.DataSource = dSet.Degree
cmbDegree.DataTextField = "NAME"
cmbDegree.DataValueField = "PKEY"
cmbDegree.DataBind()

// condition for check the value is already exists in combobox items or not.

if(cmbDegree.FindItemByValue("DEGREE") != null)
{
      // if item found with value as "DEGREE"

    cmbDegree.SelectedValue = "DEGREE";
}

let me know if any concern.

Thanks,
Jayesh Goyani

[Muhammad]

Thanks jayesh, consider the followin code of insertion in grid.

Dim editedItem As GridEditableItem = CType(e.Item, GridEditableItem)
Dim newValues As Hashtable = New Hashtable
e.Item.OwnerTableView.ExtractValuesFromItem(newValues, editedItem)

For Each entry As DictionaryEntry In newValues
          newRow(CType(entry.Key, String)) = entry.Value
Next

The above code works for other text boxes, but cmbDegree combo value is not extracting through ExtractValuesFromItem method.

Any suggestion will be appreciated.
Thanks,
Ovais

[Muhammad]

Hi,
I found a solution to my problem. If anyone interested, let me know.

Regards,
Ovais

[Michael Strasser]

Sure, please post your solution.

[Majoy]

Hi Muhammad,

 

Can you post your solution here? I'm encountering the same error.

 

 

Thanks.