javascript 如何刷新 KendoUI DropDownList?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12900548/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 17:22:56  来源:igfitidea点击:

How to refresh a KendoUI DropDownList?

javascriptasp.net-mvctelerikkendo-ui

提问by Rodney

I have a kendo ui grid that i need to update. So I have the following Mark-up:

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

I call the following script to populate the dropdownlist:

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

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

        }
    });

Once the page loads. I call the same script to refresh the Drop Down List. I've noticed in the source that the data source contains the new data but the drop down list is hidden.

一旦页面加载。我调用相同的脚本来刷新下拉列表。我在源中注意到数据源包含新数据,但下拉列表被隐藏。

What is the correct way to update the Kendo Drop Down List?

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

回答by Petur Subev

You need to initialize the kendo DropDownList only once and each time you want to refresh the data you should use the dataSource.data()method.

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

Something like :

就像是 :

$('#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);    

    }
});