剑道网格搜索工具栏抛出e.charAt不是一个函数

Question

我正在尝试将剑道搜索工具栏添加到我的网格中。

我在我的剑道网格中添加了以下内容

toolbar: ["search"],
search: {
fields: [
{ name: "BusinessArea", operator: "eq" }
]
},

把这个放在我的数据源中

fields: {
BusinessArea: { type: "string" }
}

当我运行代码并键入搜索值时，我会在控制台中得到以下内容：

2kendo.all.js:2112 Uncaught TypeError: e.charAt is not a function
at Object.expr (kendo.all.js:2112:46)
at Function.r.filterExpr (kendo.all.js:5720:25)
at r.filter (kendo.all.js:5963:35)
at Function.r.process (kendo.all.js:6160:25)
at init._queryProcess (kendo.all.js:7753:34)
at init.query (kendo.all.js:7811:35)
at init._query (kendo.all.js:7841:29)
at init.filter (kendo.all.js:7910:22)
at kendo.all.js:64008:45
expr @ kendo.all.js:2112
r.filterExpr @ kendo.all.js:5720
filter @ kendo.all.js:5963
r.process @ kendo.all.js:6160
_queryProcess @ kendo.all.js:7753
query @ kendo.all.js:7811
_query @ kendo.all.js:7841
filter @ kendo.all.js:7910
(anonymous) @ kendo.all.js:64008
setTimeout (async)
(anonymous) @ kendo.all.js:63981
dispatch @ jquery.js?v=igUc00PXGT1YBL1_Kf7QYy9fPlLqZKcEGrCqDz3EFDI:5183
elemData.handle @ jquery.js?v=igUc00PXGT1YBL1_Kf7QYy9fPlLqZKcEGrCqDz3EFDI:4991

下面是添加了上述语句的完整JS(在没有搜索的情况下按预期删除了网格(。任何建议都会很有帮助。

感谢

$("#notificationGrid").kendoGrid({
filter: function (e) {
if (e.field === "BusinessArea" || e.field === "Roles") {
if (e.filter) {
e.filter.filters.forEach(function (f) {
f.operator = "contains";
});
}
}
},
filterMenuOpen: function (e) {
if (e.sender.dataSource.filter()) {
e.sender.dataSource.filter().filters.forEach(function (f) {
//handle nested filters
if (f.filters) {
f.filters.forEach(function (z) {
if (z.field === "BusinessArea" || z.field === "Roles") {
checkbox = e.container.find("input[value='" + z.value + "']");
if (checkbox[0] && !checkbox[0].checked) {
e.container.find("input[value='" + z.value + "']").click();
}
}
});
}
if (f.field === "BusinessArea" || f.field === "Roles") {
var checkbox = e.container.find("input[value='" + f.value + "']");
if (checkbox[0] && !checkbox[0].checked) {
e.container.find("input[value='" + f.value + "']").click();
}
}
});
}
},
columns: [
{
title: "#",
template: "#= ++record #",
width: 50
},
{
field: "BusinessArea",
title: "Business Area",
filterable: {
multi: true
}
},
{
field: "NoteType.NotificationID",
title: "Notification ID",
filterable: {
multi: true
},
width: 175
},
{
field: "NoteType.NotificationName",
title: "Notification Name",
template: '<a href="/notificationdetail/#: BusinessArea #/#: NoteSubscription.NotificationType #">#: NoteType.NotificationName #</a>',
filterable: {
multi: true
}
},
{
field: "NoteSubscription.NotificationType",
title: "Notification Type",
filterable: {
multi: true
}
},
{
field: "DefaultAddress",
title: "Default From Address",
filterable: {
multi: true
}
},
{
field: "IsSubscribed",
title: "Subscribed",
filterable: {
multi: true
},
attributes: { "class": "table-cell k-text-center" },
width: 100
}
],
toolbar: ["search"],
search: {
fields: [
{ name: "BusinessArea", operator: "eq" }
]
},
editable: "inline",
filterable: true,
sortable: true,
pageable: true,
dataBinding: function () {
record = (this.dataSource.page() - 1) * this.dataSource.pageSize();
}
});
var dataSource = new kendo.data.DataSource({
error: function (e) {
if (e.status === "error") {
this.cancelChanges();
showToast("Error Occurred", e.xhr.responseText, "exclamation-circle", "red");
var grid = $('#notificationGrid').data('kendoGrid');
grid.dataSource._data = self.formatData(grid.dataSource.data());
grid.refresh();
}
},
requestEnd: onRequestEnd,
transport: {
read: {
type: "GET",
dataType: "json",
url: '/notification/getall'
},
parameterMap: function (data, operation) {
return kendo.stringify(data);
}
},
schema: {
model: {
id: "RecordKey"
},
fields: {
BusinessArea: { type: "string" }
}
},
pageSize: 25
});
function onRequestEnd(e) {
if (e.type === undefined || e.type !== "read") {
showToast("Success", "Record " + e.sender._destroyed[0].RecordKey + " successfully deleted.", "check", "green");
e.sender._destroyed = [];
}
}
self.formatData = function (data) {
return data;
};
dataSource.fetch(function () {
var data = this.data();
data = self.formatData(data);
var kendoGrid;
kendoGrid = $("#notificationGrid").data("kendoGrid");
kendoGrid.setDataSource(dataSource);
self.loaded(true);
});

Answer 1

解决了Folks问题。事实证明，我使用的是2020.1版本，因此文档不会与实际代码混淆。

我更改了以下内容：

toolbar: ["search"],
search: {
fields: [
{ name: "BusinessArea", operator: "eq" }
]
},

收件人：

toolbar: ["search"],
search: {
fields: ["BusinessArea"]
},

这默认为contains，这正是我所需要的，所以我没有进一步研究如何在我过时的版本中使用运算符函数。可能需要升级到最新版本才能利用该代码。