I'm getting an error when trying to search for data on my grid.. The error I am receiving is this: "Uncaught TypeError: (d.ComponentId || "").toLowerCase is not a function". Thank you in advance for your help.
my grid definition looks like this:
$("#grid").kendoGrid({
toolbar: [
{ template: kendo.template($("#template").html())}
],
dataSource: {
data: filteredData
},
schema: {
model: {
fields: {
ComponentId: { type: "string", filterable:true },
Description: { type: "string", filterable:true }
}
}
},
selectable: true,
allowCopy: true,
height: 430,
sortable: true,
refresh: true,
filterable: {
mode: "row"
},
columns: [
{ field: "ComponentId",title: "Component Id", template: "#=test(data)#", filterable:true},
{ field: "Description",title: "Description", template: "#=description(data)#", filterable:true }
],
}).data("kendoGrid");
And my code to filter looks like this..
$("#btnSearch").on("click", function () {
alert("clicked");
var filter = { logic: "or", filters: [] };
$searchValue = $('#searchBox').val();
if ($searchValue) {
$.each($("#grid").data("kendoGrid").columns, function( key, column ) {
if(column.filterable) {
filter.filters.push({ field: column.field, operator:"contains", value:$searchValue});
}
});
}
$("#grid").data("kendoGrid").dataSource.query({ filter: filter });
});
Also, this is the code for my toolbar template:
<
script
id
=
"template"
type
=
"text/x-kendo-template"
>
<
label
class
=
"search-label"
for
=
"searchBox"
>Search Grid:</
label
>
<
input
type
=
"search"
id
=
"searchBox"
class
=
"k-textbox"
style
=
"width: 250px"
/>
<
input
type
=
"button"
id
=
"btnSearch"
class
=
"k-button"
value
=
"Search"
/>
<
input
type
=
"button"
id
=
"btnReset"
class
=
"k-button"
value
=
"Reset"
/>
</
script
>