Kendo UI - 下拉列表设置值 autoBind = false 设置

Question

Kendo UI - 下拉列表设置值 autoBind = false 设置

3

我现在正在评估Kendo UI，以便在我们的大型应用程序中使用。我们有一个情况，即下拉列表中有很多值（如200+），并且有多个具有该大小的下拉列表。因此，如果我们有一个复杂的表单，页面加载需要时间来呈现表单。（由于每个框都需要从服务加载并填充）。

我们通过编写自己的asp.net Web控件来避免这种情况，支持按需加载（如kendo ui中下拉列表中的autoBind属性）。

现在，KendoUI的DropDownList在autobind = false的情况下可满足要求，但是在设置值时，它会首先获取远程绑定数据，然后选择适当的值。（这很酷，对于小列表来说真的很好），但潜在地意味着当我们加载页面并设置值时，它将为每个下拉列表发出远程绑定调用。

现在，

我们能否设置值/文本而不发出远程绑定？我们希望仅在用户单击下拉列表本身时才执行远程绑定。（而不是在我们填写表单时）。这将节省额外的系统调用，并帮助快速向用户呈现表单。

这里是JS Bin。

http://jsbin.com/ayivad/3/edit

如果kendo ui的某个人希望我提供帮助，请告诉我，但这个想法将允许我们很好地使用kendo ui下拉框。

<input type="button" id="btnSet" value="Set Value (Click without clicking on DropDown" />
  <br/><br/>
<select id="products"></select>



 $(document).ready(function () {
        $("#products").kendoDropDownList({
            dataTextField: "ProductName",
            dataValueField: "ProductID",
            autoBind: false,
            dataSource: {
                transport: {
                    read: {
                        dataType: "jsonp",
                        url: "http://demos.kendoui.com/service/Products",
                    }
                }
            }
        });
        var combobox = $("#products").data("kendoDropDownList"),
        setValue = function (e) {
            if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode)
                combobox.value(3);
        };
       $("#btnSet").click(setValue);
    });

感谢，Riz

- Rizwan Ahmed

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Vojtiik · Accepted Answer

1) 替换值为文本 : http://docs.kendoui.com/api/web/dropdownlist#configuration-text

Kendo: text 字符串(default: "") 当autoBind设置为false时，定义组件的文本。例如

$("#dropdownlist").kendoDropDownList({
     autoBind: false,
     text: "Chai"
});

脏的替代方案 - 尝试劫持ddl "可选标签"以满足您的需求。在页面上加载包括您想要显示在ddl中的值的数据，然后使用可选值初始化ddl，该值等于您想要显示的值。一旦用户打开ddl，远程数据将加载，加载数据后，您将覆盖/删除可选标签，然后愉快的使用。

http://docs.kendoui.com/api/web/dropdownlist#configuration-optionLabel （考虑拆分列表，200个长下拉框远非用户友好。）

$("#dropdownlist").kendoDropDownList({
optionLabel: "My value" });

考虑使用Kendo ComboBox，在你有200个项目的情况下，自动完成3个字符左右似乎是相当明智的解决方案。我们在500+ combobox中使用相同的解决方案。

Kendo UI - 下拉列表 设置值 autoBind = false 设置

Kendo UI - 下拉列表设置值 autoBind = false 设置