Telerik RadComboBox javascript API问题

Posted 2023-02-22

【中文标题】Telerik RadComboBox javascript API问题

【英文标题】：Telerik RadComboBox javascript API problem

【发布时间】：2010-12-22 09:31:10

【问题描述】：

我在使用 Telerik 的 RadComboBox 的 javascript API 时遇到了问题。不，我没有能力从 Telerik 切换到 jQuery 或其他框架。我只想说我现在头上几乎没有头发了：P

简而言之我想获取一个 RadComboBox 的选定索引，并将另一个 RadComboBox 更新为该索引。例如。在第一个 RCB 中选择一个值会自动更新客户端的第二个值。我的问题真的是我找不到在第二个 RCB 上设置索引的方法，即使文档说有一种简单的方法可以做到这一点..（你之前听说过那个：）

我已关注此页面 (telerik docs) 上的 API 文档，并且还使用了 IE8 中的 javascript 调试器和 Firefox 中出色的 FireBug。我正在使用 Telerik.Web.UI 程序集版本 2009.2.826.20

我不需要完整的解决方案源代码，但我们将不胜感激朝正确方向轻推！ :)

这是我一起编写的一些示例代码：

---

    <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>

我不需要完整的解决方案源代码，但我们将不胜感激！ :)

【参考方案1】：

非常感谢 Veselin Vasilev 和 stefpet 的投入。经过太多小时的 js 调试和同上一杯咖啡后，我确实让它与 IE8 和 FF3.5 一起工作。

用于更新并行 RadComboBoxes 的正确 javascript 事件处理程序（响应 OnClientSelectedIndexChanged 事件）：

    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();
    

这当然可以通过在一条线路上进行多次调用来缩短。我认为可能有一种方法可以用更少的代码做到这一点，但我几乎尝试了所有方法，这是唯一对我有用的解决方案。

【参考方案2】：

您使用的是“经典”RadComboBox 的客户端 API，而该组合的版本适用于 ASP.NET AJAX。以下是您的方法的外观：

function masterChanged(item)

    var detailCB = $find("<%= DetailCB.ClientID %>");

    var index = item.get_selectedIndex();
    detailCB.set_selectedIndex(index);            

这是文档中的正确链接： http://www.telerik.com/help/aspnet-ajax/combo_clientsidebasics.html

【讨论】：

非常感谢 Veselin 的链接，这确实是正确的文档！

顺便说一句，在我的版本中，RadComboBox 对象上不存在“set_selectedIndex()”js 函数。

【参考方案3】：

我没有使用 Telerik 的经验，但考虑到实际呈现的是包含选项元素的标准选择列表，您可以通过将选项的 selected 属性设置为 true 以编程方式选择选项。 p>

【讨论】：

我希望是这样。不幸的是，由于组合框用于输入数据以及选择数据，因此 RadComboBox 并非如此，它会输出一个表格、许多 div 以及如下选项：One 两个 等等..