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

Clientside javascript show some items not others

1 Answer 43 Views

ComboBox

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

Chris asked on 23 Jan 2012, 09:55 PM

Good morning,
I need to dynamically change which elements in a RadComboBox drop down list are visible.
In the code below, the value selected in the first combo box (sender) is used to constrain the value in the second combo box (rcbAsgn) using some information stored in the tooltip for the item.
I tried the following:

function RCBProjects_OnClientSelectedIndexChanged(sender, eventArgs) {

var selPrjTUID = sender.get_value();

var rcbAsgn = $find("<%= RCBAssigned.ClientID %>");

var itms = rcbAsgn.get_items();

var i; var itm; var ttt;

rcbAsgn.trackChanges();

for (i = 0; i < itms.get_count(); i++) {

itm = itms.getItem(i);

ttt = itm._properties._owner._element.attributes[0].value;

var pos = ttt.lastIndexOf("-");

var tttid = ttt.substr(pos + 2, ttt.length - pos - 1);

if (tttid.valueOf() == selPrjTUID.valueOf()) itm.show();

else itm.hide();

}

rcbAsgn.commitChanges();

}

Everything seems to work fine except that, when complete, the second combo box no longer drops down. It is stuck on whatever value it had with no drop down capability at all - even though I have verified that, for example, two of four items have been shown with the other two hidden.

Any ideas?
Thanks.
Chris

1 Answer, 1 is accepted

answered on 27 Jan 2012, 11:40 AM

Hello Chris,

In general hiding RadComboBox items at client-side is not a supported scenario.
You can possibly try the following approach:

<script type="text/javascript">

function OnClientSelectedIndexChanged(sender, eventAgrs)

{

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

var itms = rcbAsgn.get_items();

for (i=0; i<rcbAsgn.get_items().get_count(); i++)

{

var item = rcbAsgn.get_items().getItem(i);

if(item.get_text().indexOf("-") != -1)

item.hide();

}

</script>

<body>

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

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<telerik:RadComboBox ID="RadComboBox1" runat="server"

OnClientSelectedIndexChanged="OnClientSelectedIndexChanged">

<Items>

<telerik:RadComboBoxItem Text="item 1" Value="1" />

<telerik:RadComboBoxItem Text="item 2" Value="2" />

<telerik:RadComboBoxItem Text="item 3" Value="3" />

<telerik:RadComboBoxItem Text="item 4" Value="4" />

</Items>

</telerik:RadComboBox>

<telerik:RadComboBox ID="RadComboBox2" runat="server" >

<Items>

<telerik:RadComboBoxItem Text="item 1" Value="1" />

<telerik:RadComboBoxItem Text="item-2" Value="2" />

<telerik:RadComboBoxItem Text="item-3" Value="3" />

<telerik:RadComboBoxItem Text="item 4" Value="4" />

</Items>

</telerik:RadComboBox>

</div>

</form>

</body>

Regards,
Kalina
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now