我在Web应用程序中实现kendomultiselect。多选中有一个选项
如果我们在multiselect中键入一个新的项目文本,它将更新数据源和数据库。很好请在下面查看我的代码。
function fnLoadDocumentTags() {
var newTagItem = "";
function onTagDataBound() {
if ((newTagItem || this._prev) && newTagItem !== this._prev) {
var ds = this.dataSource,
datas = ds.data(),
lastItem = datas[datas.length - 1];
newTagItem = this._prev;
if (/\(Add New\)$/i.test(lastItem.TagName)) {
ds.remove(lastItem);
}
var newEntryFound = _.findWhere(datas, { TagName: newTagItem }) != null;
if (newTagItem.length > 0 && !newEntryFound) {
ds.add({
TagName: newTagItem + " (Add New)", TagID: newTagItem
});
this.open();
}
}
}
function onTagSelect(e) {
debugger;
var dataItem = this.dataSource.view()[e.item.index()],
datas = this.dataSource.data(),
lastData = datas[datas.length - 1];
if (parseInt(dataItem.TagID) > 0) {
//////this.dataSource.remove(lastData);
}
else {
if (newTagItem.length > 0) {
var tagID = fnInsertDocumentTags(newTagItem);
dataItem.TagName = dataItem.TagName.replace(" (Add New)", "");
dataItem.TagID = tagID;
}
}
////$.each(datas, function (index, value) {
//// debugger;
//// if (datas[index].TagID == 0) {
//// var dummyItem = datas[index];
//// this.dataSource.remove(dummyItem);
//// return;
//// }
////});
}
function onTagClose(e) {
fnTagsChangeSelect();
}
var data = new kendo.data.DataSource({
batch: true,
transport: {
read: {
url: urljsonGetDocumentTags,
dataType: "json"
},
},
schema: {
model: {
id: "TagID",
fields: {
TagID: {
type: "number"
},
TagName: { type: "string" }
}
}
}
});
$("#Tags").kendoMultiSelect({
animation: false,
dataTextField: "TagName",
dataValueField: "TagID",
dataSource: data,
dataBound: onTagDataBound,
select: onTagSelect,
close: onTagClose
});
}
但是同时我遇到一个问题,当我在多选中键入文本时,该文本与多选中的选定项目重叠。请参见下图。
任何人有建议都很好...