Question

我正在使用免费的Kendo UI核心框架。我正在寻找一个可搜索的Combobox，插入后会激活sql，例如2个字母。在我的列表框后面有超过10000个项目，现在加载或刷新页面需要花费太多时间。

是否可以仅通过自动完成小部件等用户输入来触发sql查询？

我的代码是：

<link href="test/styles/kendo.common.min.css" rel="stylesheet" />
<link href="test/styles/kendo.default.min.css" rel="stylesheet" />
<script src="test/js/jquery.min.js"></script>
<script src="test/js/kendo.ui.core.min.js"></script>

 <script>
 $(document).ready(function() {

 var objekte = $("#objekte").kendoComboBox({
 placeholder: "Objekt auswählen",
 dataTextField: "kurzname",
 dataValueField: "objekt_id",
 minLength: 2,
 delay: 0,

 dataSource: new kendo.data.DataSource({
    transport: {
      read: "test/objects.php"
    },

    schema: {
        data: "data"
    }

 }),
 }).data("kendoComboBox");
 </script>

Answer 1

您应该将autoBind设置为false，以便在绑定（初始化）时不自动从服务器加载所有内容。

然后，将其与minLength结合使用，以指定用户应键入的最小字符数。

最后，将serverFiltering设置为true，以便只显示符合条件的元素。

从Kendo UI网站查看此演示：http://demos.telerik.com/kendo-ui/web/combobox/serverfiltering.html

Answer 2

现在有效！

 var objekte = $("#maytest1objekt").kendoComboBox({
 placeholder: "Objekt auswählen",
 dataTextField: "kurzname",
 dataValueField: "objekt_id",

 serverFiltering: true,
 filter: "startswith",
 autoBind: false,
 minLength: 1,
 delay: 0,

 dataSource: new kendo.data.DataSource({
    transport: {
      read: "test/objects.php"
    },
    schema: {
        data: "data"
    }
 }),
 }).data("kendoComboBox");

Kendo UI，可搜索的Combobox

2 个答案: