如何刷新 KendoUI DropDownList？答案

【问题标题】：How to refresh a KendoUI DropDownList?如何刷新 KendoUI DropDownList？
【发布时间】：2012-10-05 17:13:23
【问题描述】：

我有一个需要更新的剑道 ui 网格。所以我有以下标记：

我调用以下脚本来填充下拉列表：

   // An Ajax call to load the selected hover into the controls
    $.ajax({
        type: 'POST',
        url: '/Reports/HoverManager/GetHoversForDropDown',
        data: { sectionId: sectionId },
        error: function(response){
            $('.hover-manager .error').html(response.responseText).fadeIn(500).delay(5000).fadeOut(500);
        },
        success: function(response){

            $('.hover-manager #hoverSelect').kendoDropDownList({  
                animation: false,
                dataTextField: "Name",
                dataValueField: "ID",
                dataSource: response.hovers,
                change: hoverDownDownChange,
            }).data('kendoDropDownList').value(hoverId);    

        }
    });

页面加载后。我调用相同的脚本来刷新下拉列表。我在源代码中注意到数据源包含新数据，但下拉列表是隐藏的。

更新剑道下拉列表的正确方法是什么？

【问题讨论】：

标签： javascript asp.net-mvc telerik kendo-ui

【解决方案1】：

您只需要初始化 kendo DropDownList 一次，并且每次要刷新数据时都应该使用 dataSource.data() 方法。

类似：

$('#hoverSelect').kendoDropDownList({  
            animation: false,
            dataTextField: "Name",
            dataValueField: "ID",                
            change: hoverDownDownChange,
        }).data('kendoDropDownList').value(hoverId); 

$.ajax({
    type: 'POST',
    url: '/Reports/HoverManager/GetHoversForDropDown',
    data: { sectionId: sectionId },
    error: function(response){
        $('.hover-manager .error').html(response.responseText).fadeIn(500).delay(5000).fadeOut(500);
    },        success: function(response){

        $('#hoverSelect').data('kendoDropDownList').dataSource.data(response.hovers);    

    }
});

【讨论】：