Question

我在模板中使用了Kendo下拉列表。它加载用于对记录进行签名的客户端名称列表。客户名称列表包含8k个条目。

表单加载正常但如果我选择下拉列表来更改客户端名称，则列表显示大约需要10秒。我有什么办法可以加快速度吗？

我的数据源：

 var dsClients = new kendo.data.DataSource({
    transport: {
        read: {
          url: "/data/clients/key",
          dataType: "jsonp"
      },
      parameterMap: function(options, operation) {
          if (operation === "read") {
              return options;
          }
      }
    },
    serverSorting: true,
    sort: [{ field: "text", dir: "asc" }]
});

我的模板中的元素：

 <input name="idclt_clm" data-bind="value:idclt_clm" data-value-field="value" 
   data-text-field="text" data-option-label="Select" data-source="dsClients" 
   data-role="dropdownlist" required validationMessage="Required" />

Answer 1

我知道有两个选项。

您可以添加我刚刚找到的虚拟化 Kendo。
您可以在触发搜索之前启用自动绑定并使用需要2个字符的搜索过滤器。以下是我用asp.net和JS
完成的方法
@(Html.Kendo() .DropDownList() .Name("GridName") .HtmlAttributes(new { @class = "form-control" }) .DataSource(ds => ds.Read(read => read.Action("YourFunction","YourController").Data("filterFunction")) .ServerFiltering(true)) .MinLength(2)//number of characters for a valid search .Delay(250)//milliseconds delay to trigger search .AutoClose(false) .AutoBind(false) .IgnoreCase(true) .DataTextField("Text") .DataValueField("Value") .Placeholder("Enter at least 2 letters to search") .Filter(FilterType.Contains) )

<script> function filterFunction() { return { text: $("#GridName").data("kendoDropDownList").input.val() }; } </script>

如果搜索仍然很慢，您可以更改字符数

Answer 2

好吧，如果两者都做怎么办？也许不是最好的方法，但对我来说却奏效了。我有一个ComboBox，它从一个级联事件获取其信息，因此它将尝试以任何一种方式来填充它。因此，在发送填充请求到服务器端后，我有一个客户端事件：

.Filter(Contains).MinLength(n).Filtering("Action")

这将进入服务器throgh ajax来捕获您试图填充CB的表/列表的Session var。然后过滤所需的列表，并将其发送回CB。

Kendo UI Dropdownlist从大型数据源缓慢加载

2 个答案: