My project has a Kendo Grid that has the usual table header filtering, but I've also been asked to provide custom filters for status types and years (multi-select). So I have a drop-down with a set of years to select from, and the user can select any of six year options. So here's the logic of the filter:
Years column: Show all rows whose year matches one of the year options. This filter uses "or" logic.
Status column: Show all rows whose status equals one of the selected options. Also "or" logic.
The filters must use "and" logic to combine the two filters.
function setStatusGridFilters() {
var grid = $("#MyKendoGrid").data("kendoGrid");
var dataSource = grid.dataSource;
var filterCollection = { logic: "or", filters: [] };
var displayStatuses = $("#StatusFilter").getKendoCheckBoxGroup().value();
for (var i = 0; i < displayStatuses.length; i++) {
filterCollection.filters.push({ field: "Status", operator: "eq", value: displayStatuses[i] });
}
dataSource.filter(filterCollection);
dataSource.read();
}
function setYearGridFilters() {
var grid = $("#myKendoGrid").data("kendoGrid");
var dataSource = grid.dataSource;
var filterCollection = { logic: "or", filters: [] };
var years = $("#YearList").val();
for (var i = 0; i < years.length; i++) {
filterCollection.filters.push({ field: "Year", operator: "eq", value: years[i] });
dataSource.filter(filterCollection);
dataSource.read();
}This just isn't working, and I'm not sure how to pull it off. Either of these custom filters works by itself, but I haven't found a way to make them work together. Each filter should be "or" with the selected options, but "and" between them.