我在使用剑道多选时遇到了这个奇怪的问题。
<input id="addTags" /><br>
<input type="button" onclick="fillaList();" value="fill List" />
<input type="button" onclick="clearList();" value="Init List" />
var list=[{label:'tag1', value:'1'},
{label:'tag9', value:'9'},
{label:'tag8', value:'8'},
{label:'tag7', value:'7'},
{label:'tag6', value:'6'},
{label:'tag5', value:'5'},
{label:'tag4', value:'4'},
{label:'tag3', value:'3'},
{label:'tag2', value:'2'}];
function fillData(tagIds){
var tagObj = $("#addTags").data("kendoMultiSelect");
if (tagObj == undefined) { // if not loaded
$("#addTags").kendoMultiSelect({
dataTextField: "label",
dataValueField: "value",
dataSource: list,
value: tagIds, placeholder: "Select from list",
change: function() {
// change
}
});
} else { // if already loaded only change the values.
tagObj.value(tagIds);
console.log(tagIds);
console.log(tagObj.value());
}
}
function fillaList(){
var tagIds=[1,2,3];
fillData(tagIds);
}
function clearList(){
fillData([]);
}
http://jsfiddle.net/ruchan/AgV52/1/
问题复制
用鼠标选择时不存在此问题。
我在 Chrome v32.0.1700.107 m 中测试
最佳答案
在多选中设置新值之前,您应该在 tagObj.dataSource.filter({});
之前清理过滤器
你的功能应该是:
function fillData(tagIds){
var tagObj = $("#addTags").data("kendoMultiSelect");
if (tagObj == undefined) { // if not loaded
$("#addTags").kendoMultiSelect({
dataTextField: "label",
dataValueField: "value",
dataSource: list,
value: tagIds, placeholder: "Select from list",
change: function() {
// change
}
});
} else { // if already loaded only change the values.
// Clean DataSource filter before setting new values
tagObj.dataSource.filter({});
tagObj.value(tagIds);
console.log(tagIds);
console.log(tagObj.value());
}
}
您的 JSFiddle 在这里修改:http://jsfiddle.net/OnaBai/AgV52/2/
关于jquery - 剑道多选值设置Bug,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/22010796/