我有一个Kendo Combobox,之前我问过question。过滤工作正常,但在完成过滤后,选择列表中的选项将失去其属性。有什么理由吗?请告诉我。
这是Dojo。
过滤前:
<select id="users">
<option value="1" code="user1" data-message="OK1">User 1</option>
<option value="2" code="user2" data-message="OK2">User 2</option>
<option value="3" code="user3" data-message="OK3">User 3</option>
<option value="4" code="user4" data-message="OK4">User 4</option>
</select>
过滤后:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
< select id="users" data - role="combobox" aria - disabled="false" aria - readonly="false" style="display: none;">
<option value="2">User 2</option>// lost code and data-message
<option value="3">User 3</option> // lost code and data-message
</select>
&#13;
干杯。
更新 问题是控件已经在服务器端初始化,我只是在客户端执行过滤。如果不重新初始化控件,是否无法执行过滤?
答案 0 :(得分:1)
我可能会采取一种稍微不同的方法并按照这种方式进行。
<!-- Template for Combobox Items -->
<script id="template" type="text/x-kendo-template">
<span value="#: value #" code="#: code #" data-message="#: message#">#: displayText #</span>
</script>
<!-- Element to convert to Kendo Combobox -->
<div id='users'></div>
<script>
// Data for the ComboBox
var data = [{value: "1", code: "user1", message:"OK1", displayText: "User 1"},
{value: "2", code: "user2", message:"OK2", displayText: "User 2"},
{value: "3", code: "user3", message:"OK3", displayText: "User 3"},
{value: "4", code: "user4", message:"OK4", displayText: "User 4"}
]
$(document).ready(function() {
// Create the ComboBox
$('#users').kendoComboBox({
dataSource: data,
dataTextField: "displayText",
dataValueField: "value",
template: kendo.template($("#template").html())
});
//filtering
var _flt = { logic: "or", filters: [] };
_flt.filters.push({ field: 'value', operator: "contains", value: "2" });
_flt.filters.push({ field: 'value', operator: "contains", value: "3" });
$('#users').getKendoComboBox().dataSource.filter(_flt);
//select the first item
$('#users').getKendoComboBox().select(0);
});
</script>