如果数据源有大量数据,Kendo组合框需要时间来加载和打开

时间:2014-10-08 12:25:45

标签: javascript kendo-ui

我尝试使用Kendo Combobox和数据源,结构如下:

{text: "12 Angry Men", value:"1"}

和Kendo Combobox初始化为:

$("#movies").kendoComboBox({
     dataTextField: "text",
     dataValueField: "value",
     dataSource: data,
     height: 100
})
    .closest(".k-widget")
    .attr("id", "movies_wrapper")
;

$("#filter").kendoDropDownList({
    change: filterTypeOnChanged
});

结果发现,对于大约40,000个物体的数据,组合框需要3秒的加载延迟和6-7秒的延迟才能打开它。

我调试了本机代码,发现在弹出窗口中显示这么多对象需要一些时间来处理动画。

因此我尝试将动画传递为false。

但这仍然没有减少延迟。有人可以帮助解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

我自己尝试加载大约有类似的问题。将20000个项目组合成一个组合框。

绕过它的方法是使用服务器过滤仅撤回有限数量的结果。我发现100是一个足够好的数字,如果结果不是那么,那么过滤词需要更具体一些来获得最终正确的项目。

这显然意味着更多的访问服务器以获得结果,但我发现这是值得采取的权衡。

  $('#' + fullControlID).kendoComboBox({
        dataTextField: 'Text',
        dataValueField: 'Value',
        filter: "contains",
        autoBind: true,
        ignoreCase: true,
        minLength: 3,
        change: function (e) {
            $('#' + fullControlID).data("kendoComboBox").dataSource.read();
        },
        dataSource: {
            serverfiltering: true,
            serverPaging: true,
            pageSize: 100,
            transport: {
                read:
                    {
                        type: "POST",
                        dataType: "json",
                        url: transportUrl,
                        cache: false,
                        data: {

                            filterText: function () {
                                var filter = $('#' + fullControlID).data("kendoComboBox").input.val();
                                if(filter === '{the place holder text ignore it}')
                                {
                                    filter = '';
                                }

                                return filter; 
                            }    

                        },
                    }
            }
        }


    });

上面是我用来在幕后使用适当的控制器/动作(使用mvc)执行此操作的一些代码。

如果您需要更多信息,请告知我们。

注意:( fullcontrolID是作为组合框的控件的id)。