This is a migrated thread and some comments may be shown as answers.

SelectedValue On Related ComboBox Empty On PostBack

16 Answers 685 Views

ComboBox

This is a migrated thread and some comments may be shown as answers.

John asked on 30 Sep 2010, 11:03 AM

Hello,

I'm using the some RadComboBoxes on my WebUserControl that is used to Edit RadGrid Items.
Some of this Comboboxes are related. I have followed your Example: "Related ComboBoxes" of your Onlinedemos. All seems to be working, i can select values in the first ComboxBox and after this the related ComboBox gets refreshed and I'm able to select Items in the second one. But when i hit the Button for the Update the SelectedValue Property of the Second ComboBox is Empty but the Text Property shows the right selected Itemtext.

What I'm doing wrong?

EDIT:
Something strange is going on... trying to explain.

When WebUserControl Loads, ComboBox 1 Items looks like:

1, Item1 (selected)
2, Item2
3, Item3

where the first column presents the Value and the Second column the Text of the ComboBox
ComboBox2 Items look like this:

1, Item1a
2, Item2a (selected)

where the first column presents the Value and the Second column the Text of the ComboBox.

So ComboBox1.SelecedValue=1 and ComboBox2.SelectedValue=2

When i change the Selected Item in ComboBox1 to Item3 (Value = 3) then the ComboBox2 gets new Items like this:

1, Item3a
2, Item3b
3, Item3c

where the first column presents the Value and the Second column the Text of the ComboBox. No Item is then initial selected.
When i now change the SelectedItem of ComboBox2 to Item3b (Value 2) the Update Function of the RadGrid does not get a valid SelectedValue. When i select the Item "Item3c" it also does not get a valid value. Only when i select the First Entry "Item3a" i get a valid SelecedValue of "1"

For me it looks like that the Selected Value gets only avaliable on Postback when the Initial Itemlist contains the same Value as the reloaded Itemlist and the Selected Item in the reloaded list does not have the same Value as the Initial Selected Item.

Strange strange strange....

16 Answers, 1 is accepted

answered on 30 Sep 2010, 02:53 PM

Hello John,

Indeed this is a strange issue. Could you try reproducing it only with the second RadComboBox, i.e. change its initial values to see whether the SelectedValue correctly reflects the Item selected on the client? (You may want to add more Items initially for more test cases.)

All the best,
Simon
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

answered on 30 Sep 2010, 03:31 PM

I've added some more items to the first ComboBox and then also to the second one.
I've also added a Clientside Script for the SelectedIndexChanged Event of ComboBox1 and ComboBox2 and to the Update Button (of the WebUserControl) and also on the Serverside for the Update Button (of the WebUserControl).

When i change the SelectedItem on ComboBox1 the ClientScript alerts the right Value for the selected Item. Also the second ComboBox have the correct SelectedValue when I change the Selected Item. And the Values of both Comboboxes are absolutly correct when i hit the Update Button and the Clientside Script (OnClick) runs. But the Serverside OnClick Event onyl have the correct Text Value, The SelectedValue is empty.

answered on 03 Oct 2010, 09:20 AM

Here is an complete Websiteproject extracted from my solution where you can see this behaviour.

default.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="RadControlsWebApp1._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

//Put your JavaScript code here.

</script>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"

DefaultLoadingPanelID="RadAjaxLoadingPanel1">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" UpdatePanelHeight="" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadSkinManager ID="RadSkinManager1" Runat="server" Skin="Telerik">

</telerik:RadSkinManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"

Skin="Default">

</telerik:RadAjaxLoadingPanel>

<div>

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

GridLines="None">

<ClientSettings>

<Selecting AllowRowSelect="True" />

</ClientSettings>

<MasterTableView EditMode="PopUp">

<CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>

<RowIndicatorColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

<Columns>

<telerik:GridEditCommandColumn>

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="ID" DataType="System.Int32" HeaderText="ID"

UniqueName="ID">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="COL2" HeaderText="COL2" UniqueName="COL2">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ID1" HeaderText="ID1" UniqueName="ID1">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ID2" HeaderText="ID2" UniqueName="ID2">

</telerik:GridBoundColumn>

<telerik:GridButtonColumn CommandName="Delete" Text="Delete"

UniqueName="column">

</telerik:GridButtonColumn>

</Columns>

<EditFormSettings EditFormType="WebUserControl" UserControlName="Editor.ascx">

<PopUpSettings Modal="True" />

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

</div>

</form>

</body>

</html>

default.aspx (code)

Imports Telerik.Web.UI

Partial Class _Default

Inherits System.Web.UI.Page

Private Sub RadGrid1_NeedDataSource(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadGrid1.NeedDataSource

RadGrid1.DataSource = GetTab(9999)

End Sub

End Class

Editor.ascx

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="Editor.ascx.vb" Inherits="RadControlsWebApp1.Editor" %>

<table cellpadding="0" cellspacing="0" border="0">

<tr>

<td style="width:150px;">Text</td>

<td style="width:20px;"> </td>

<td style="width:210px;">

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

</td>

</tr>

<tr>

<td> </td>

</tr>

<tr>

<td>ID1</td>

<td> </td>

<td>

<telerik:RadComboBox runat="server" Width="200px" ID="RadComboBox1"

DropDownWidth="295px" AutoPostBack="false" HighlightTemplatedItems="True"

MarkFirstMatch="True" DataTextField="COL2" AllowCustomText="true" EmptyMessage="bitte wählen..."

DataValueField="ID" OnClientSelectedIndexChanging="OnRCB1SelectedIndexChanging">

<%-- OnClientSelectedIndexChanging="OnKategorieSelectedIndexChanging">

<Items>

<telerik:RadComboBoxItem runat="server" Selected="True" Text="bitte wählen" Visible="false" />

</Items>

--%> <HeaderTemplate>

<table style="width:275px;" cellpadding="0" cellspacing="0">

<tr>

<td style="width:75px;">ID</td>

<td style="width:200px;">COL2</td>

</tr>

</table>

</HeaderTemplate>

<ItemTemplate>

<table style="width:275px;" cellpadding="0" cellspacing="0">

<tr>

<td style="width:75px;"><%# DataBinder.Eval(Container.DataItem, "ID")%></td>

<td style="width:200px;"><%# DataBinder.Eval(Container.DataItem, "COL2")%></td>

</tr>

</table>

</ItemTemplate>

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td> </td>

</tr>

<tr>

<td>ID2</td>

<td> </td>

<td>

<telerik:RadComboBox ID="RadComboBox2" Runat="server" Width="200px" DropDownWidth="295px" AutoPostBack="false" HighlightTemplatedItems="True"

MarkFirstMatch="True" DataTextField="COL2" AllowCustomText="true" EmptyMessage="bitte wählen..."

DataValueField="ID" OnClientItemsRequested="OnRCB2Loaded">

<%-- OnClientSelectedIndexChanging="OnKategorieSelectedIndexChanging">

<Items>

<telerik:RadComboBoxItem runat="server" Selected="True" Text="bitte wählen" Visible="false" />

</Items>

--%> <HeaderTemplate>

<table style="width:275px;" cellpadding="0" cellspacing="0">

<tr>

<td style="width:75px;">ID</td>

<td style="width:200px;">COL2</td>

</tr>

</table>

</HeaderTemplate>

<ItemTemplate>

<table style="width:275px;" cellpadding="0" cellspacing="0">

<tr>

<td style="width:75px;"><%# DataBinder.Eval(Container.DataItem, "ID")%></td>

<td style="width:200px;"><%# DataBinder.Eval(Container.DataItem, "COL2")%></td>

</tr>

</table>

</ItemTemplate></telerik:RadComboBox>

</td>

</tr>

<tr>

<td> </td>

</tr>

<tr>

<td colspan="3">

<asp:Button ID="btnUpdate" runat="server" Text="" OnClientClick="OnBtnClick();" />

<asp:Button ID="btnCancel" runat="server" Text="Cancel" CommandName="Cancel" />

</td>

</tr>

</table>

<telerik:RadScriptBlock ID="SCRIPTING2" runat="server">

<script type="text/javascript" language="javascript">

function OnRCB1SelectedIndexChanging(cb, args) {

var itm = args.get_item();

var subcb = $find("<%= RadComboBox2.ClientID %>");

if (subcb) {

subcb.requestItems(itm.get_value(), false);

}

function OnRCB2Loaded(cb, args) {

var subcb = $find("<%= RadComboBox2.ClientID %>");

if (subcb) {

subcb.set_text("");

subcb.set_emptyMessage("bitte wählen...");

}

function OnBtnClick() {

var subcb = $find("<%= RadComboBox2.ClientID %>");

if (subcb) {

alert(subcb.get_value());

}

</script>

</telerik:RadScriptBlock>

Editor.ascx (code)

Public Class Editor

Inherits System.Web.UI.UserControl

Private _IsInsert As Boolean

Private Sub Page_DataBinding(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.DataBinding

RadComboBox1.DataSource = GetTab(0)

If _IsInsert = False Then

Dim editedItem As Telerik.Web.UI.GridEditFormItem = Me.Parent.NamingContainer

TextBox1.Text = editedItem("COL2").Text

If String.IsNullOrEmpty(editedItem("ID1").Text) Then

RadComboBox2.DataSource = Nothing

RadComboBox1.SelectedValue = String.Empty

RadComboBox1.Text = String.Empty

Else

RadComboBox2.DataSource = GetTab(CInt(editedItem("ID1").Text))

RadComboBox1.SelectedValue = editedItem("ID1").Text

End If

RadComboBox2.SelectedValue = editedItem("ID2").Text

End If

End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

If TypeOf (Me.Parent.NamingContainer) Is Telerik.Web.UI.GridEditFormInsertItem Then

_IsInsert = True

btnUpdate.Text = "anlegen"

btnUpdate.CommandName = "PerformInsert"

Else

_IsInsert = False

btnUpdate.Text = "aktualisieren"

btnUpdate.CommandName = "Update"

End If

End Sub

Private Sub RadComboBox2_ItemsRequested(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs) Handles RadComboBox2.ItemsRequested

If IsNumeric(e.Text) Then

RadComboBox2.ClearSelection()

RadComboBox2.Items.Clear()

If String.IsNullOrEmpty(e.Text) Then

RadComboBox2.DataSource = Nothing

Else

RadComboBox2.DataSource = GetTab(CInt(e.Text))

End If

RadComboBox2.DataBind()

End If

End Sub

Private Sub btnUpdate_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnUpdate.Click

Debug.Print(RadComboBox2.SelectedValue & "/" & RadComboBox2.Text)

End Sub

End Class

libr.vb (module code)

Module Libr

Public Function GetTab(ByVal type As Integer) As System.Data.DataTable

Dim tab As New System.Data.DataTable

Dim colcount As Integer

Dim rowcount As Integer

Dim row As System.Data.DataRow

Select Case type

Case 0

colcount = 2

rowcount = 4

Case 1

colcount = 2

rowcount = 2

Case 2

colcount = 2

rowcount = 5

Case 3

colcount = 2

rowcount = 8

Case 4

colcount = 2

rowcount = 10

Case Else

colcount = 4

rowcount = 5

End Select

For x = 1 To colcount

If x = 1 Then

tab.Columns.Add("ID", System.Type.GetType("System.Int32"))

Else

If x > 2 Then

tab.Columns.Add("ID" & x - 2, System.Type.GetType("System.Int32"))

Else

tab.Columns.Add("COL" & x, System.Type.GetType("System.String"))

End If

Next

For y = 1 To rowcount

row = tab.NewRow

For x = 1 To colcount

If x = 1 Then

row.Item(x - 1) = y

Else

If x > 2 Then

row.Item(x - 1) = 2

Else

row.Item(x - 1) = "ROW" & y & "COL" & x

End If

Next

tab.Rows.Add(row)

Next

GetTab = tab

End Function

End Module

answered on 08 Oct 2010, 10:42 AM

radcontrolswebapp1.zip

Hello John,
Please excuse me for the delayed reply.

In order to reproduce the issue that you describe I created a sample project based on the code pasted here.
After a small change at “OnRCB1SelectedIndexChanging” function I easily retrieved the SelectedValue at RadComboBox2 at server-side:

function OnRCB1SelectedIndexChanging(cb, args) {

var itm = args.get_item();

var subcb = $find("<%= RadComboBox2.ClientID %>");

if (subcb) {

//subcb.requestItems(itm.get_value(), false);

subcb.requestItems(itm.get_text(), false);

}

If the issue persists - it will be highly appreciated if you open a support ticket and send us a simplified working project that reproduces it. Thank you.

All the best,
Kalina
the Telerik team

answered on 09 Oct 2010, 06:45 AM

Thank Kalina for trying to help me,
but i think you have missed that when you change the SelectedIndexChanging routine to retrieve the Text of the ComboBox ant not the selected value, the underlying routines does not assign a new datasource to the RadComboBox2. So RadComboBox2 have the initial loaded Items from Serverside and then the SelectedValue has a valid value.

The Problem is that when you change the Datasource on Clientside after you have initial assigned a Datasource on Serverside the SelectedValue Property does not have a valid value.

Take a deeper look at my example and my error desciption and watch debug output on console.

Thanks

answered on 28 Feb 2011, 02:07 PM

Hello John Patzek,

I am afraid that the issue that you experience is related with the server-side logic that you implement at Page_DataBinding event.
Please remove the setting of the RadComboBox2.SelectedValue at Page_DataBinding and test the page behaviour again.
I can suggest you reconsider the logic that you use in order to set a pre-selected item in RadComboBox2.
I believe that this online demo will help you.

Kind regards,
Kalina
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!