如何使 Kendo 下拉列表不区分大小写
How can I make Kendo Drop Down List to Case Insensitive
我想为 kendo 下拉列表设置一个值,而不考虑大小写。
举个例子,下面的代码运行良好。
$("#color").data("kendoDropDownList").value("Grey");
我也需要它来处理以下代码:
$("#color").data("kendoDropDownList").value("grey");
(function() {
var data = [{
text: "Black",
value: "Black"
}, {
text: "Orange",
value: "Orange"
}, {
text: "Grey",
value: "Grey"
}];
// create DropDownList from input HTML element
$("#color").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
dataSource: data,
index: 0
});
var color = $("#color").data("kendoDropDownList");
color.value("Grey");
})();
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.common.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.default.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.all.min.css" rel="stylesheet" />
<script src="https://kendo.cdn.telerik.com/2016.2.504/js/kendo.all.min.js"></script>
<input id="color" value="1" style="width: 100%;" />
请查看 fiddle 以便更好地理解:https://jsfiddle.net/Hd47F/329/
查看文档,您会发现这并没有像您预期的那样工作。您正在尝试设置值,而不是过滤下拉列表。 ignoreCase 属性 仅适用于过滤,设置值需要根据我所见完全区分大小写。
不要使用 value()
设置值,请尝试使用 search()
,如下所示。
$("#color").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
dataSource: data, // using your same data as above
index: 0
});
var color = $("#color").data("kendoDropDownList");
color.search("grey"); // This now works regardless of casing
你可以在这里看到我的例子:http://dojo.telerik.com/ewEyoC
我想为 kendo 下拉列表设置一个值,而不考虑大小写。
举个例子,下面的代码运行良好。
$("#color").data("kendoDropDownList").value("Grey");
我也需要它来处理以下代码:
$("#color").data("kendoDropDownList").value("grey");
(function() {
var data = [{
text: "Black",
value: "Black"
}, {
text: "Orange",
value: "Orange"
}, {
text: "Grey",
value: "Grey"
}];
// create DropDownList from input HTML element
$("#color").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
dataSource: data,
index: 0
});
var color = $("#color").data("kendoDropDownList");
color.value("Grey");
})();
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.common.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.default.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2016.2.504/styles/kendo.all.min.css" rel="stylesheet" />
<script src="https://kendo.cdn.telerik.com/2016.2.504/js/kendo.all.min.js"></script>
<input id="color" value="1" style="width: 100%;" />
请查看 fiddle 以便更好地理解:https://jsfiddle.net/Hd47F/329/
查看文档,您会发现这并没有像您预期的那样工作。您正在尝试设置值,而不是过滤下拉列表。 ignoreCase 属性 仅适用于过滤,设置值需要根据我所见完全区分大小写。
不要使用 value()
设置值,请尝试使用 search()
,如下所示。
$("#color").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
dataSource: data, // using your same data as above
index: 0
});
var color = $("#color").data("kendoDropDownList");
color.search("grey"); // This now works regardless of casing
你可以在这里看到我的例子:http://dojo.telerik.com/ewEyoC