Telerik RadComboBox javascript API problem

asp.net, javascript, telerik

Solution

Many thanks to Veselin Vasilev and stefpet for their input. After too many hours of js debugging and ditto cups of coffee I did get this to work with IE8 and FF3.5.

The correct javascript event handler for updating parallel RadComboBoxes (responding to the OnClientSelectedIndexChanged event):

    function masterChanged(sender, e)
    {
        var detailCB = $find("<%= DetailCB.ClientID %>");

        var item = e.get_item();
        var index = item.get_index();                //get selectedIndex in master
        var allDetailItems = detailCB.get_items();
        var itemAtIndex = allDetailItems.getItem(index);  //get item in detailCB
        itemAtIndex.select();
    }

This can of course be shortened by doing several calls on a single line. I recon there may well be a way to do this with less code, but I tried just about everything and this is the only solution that worked for me.

Problem

I've been having a problem using the javascript API of the RadComboBox from Telerik. And no I don't have the power to switch over from Telerik to jQuery or another framework.. Suffice to say I have hardly any hair left on my head now :P In a nutshell I want to grab the selected index of one RadComboBox, and update another RadComboBox to this index. Eg. selecting a value in the first RCB automatically updates the second on the client side. My problem really is that I can't find a way to set the index on the second RCB, even though the docs says there is an easy way to do it .. (you heard that one before right :) I've followed the API docs at this page (telerik docs), and also used the javascript debugger in IE8 and the excellent FireBug in Firefox. I'm using Telerik.Web.UI assembly version 2009.2.826.20 I don't need full source for a solution, but a nudge in the right direction would be much appreciated! :) Here's some example code I cooked together: ``` <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <script type="text/javascript" language="javascript"> function masterChanged(item) { var detailCB = <%= DetailCB.ClientID %>; var index = item.get_selectedIndex(); detailCB.SetSelected(index); //method does not exist, but should according to the docs.. } </script> <div> <telerik:RadComboBox ID="MasterCB" runat="server" OnClientSelectedIndexChanged="masterChanged"> <Items> <telerik:RadComboBoxItem Text="One" Value="1" runat="server" /> <telerik:RadComboBoxItem Text="Two" Value="2" runat="server" /> <telerik:RadComboBoxItem Text="Three" Value="3" runat="server" /> </Items> </telerik:RadComboBox> </div> <div> <telerik:RadComboBox ID="DetailCB" runat="server"> <Items> <telerik:RadComboBoxItem Text="One" Value="1" runat="server" /> <telerik:RadComboBoxItem Text="Two" Value="2" runat="server" /> <telerik:RadComboBoxItem Text="Three" Value="3" runat="server" /> </Items> </telerik:RadComboBox> </div> </form> ``` I don't need full source for a solution, but a kick in the right direction would be much appreciated! :)

Original source