如何为Kendo Grid程序化应用多条件组合过滤？

你的问题出在两个过滤函数各自独立设置数据源的过滤条件，导致每次调用都会覆盖之前的过滤规则，无法实现状态OR条件和年份OR条件之间的AND组合。

要解决这个问题，需要统一构建包含所有过滤条件的复合过滤器，而不是单独设置单一条件。具体实现如下：

修改后的完整代码 #

// 统一处理组合过滤的核心函数
function applyCombinedGridFilters() {
    var grid = $("#MyKendoGrid").data("kendoGrid");
    if (!grid) return; // 避免网格未初始化的异常
    var dataSource = grid.dataSource;
    
    // 顶层过滤器：状态和年份条件用AND逻辑组合
    var combinedFilters = { logic: "and", filters: [] };

    // 构建状态的OR过滤组
    var selectedStatuses = $("#StatusFilter").getKendoCheckBoxGroup().value();
    if (selectedStatuses && selectedStatuses.length > 0) {
        var statusFilterGroup = { logic: "or", filters: [] };
        selectedStatuses.forEach(status => {
            statusFilterGroup.filters.push({ field: "Status", operator: "eq", value: status });
        });
        combinedFilters.filters.push(statusFilterGroup);
    }

    // 构建年份的OR过滤组
    var selectedYears = $("#YearList").val();
    if (selectedYears && selectedYears.length > 0) {
        var yearFilterGroup = { logic: "or", filters: [] };
        selectedYears.forEach(year => {
            yearFilterGroup.filters.push({ field: "Year", operator: "eq", value: year });
        });
        combinedFilters.filters.push(yearFilterGroup);
    }

    // 处理无过滤条件的情况：清空过滤器显示所有数据
    if (combinedFilters.filters.length === 0) {
        dataSource.filter({});
    } else {
        dataSource.filter(combinedFilters);
    }
    dataSource.read();
}

// 修改原有触发函数，统一调用组合过滤逻辑
function setStatusGridFilters() {
    applyCombinedGridFilters();
}

function setYearGridFilters() {
    applyCombinedGridFilters();
}

关键细节说明 #

• 统一过滤入口：所有过滤操作都通过applyCombinedGridFilters执行，确保每次都重新计算完整的过滤条件，不会出现覆盖问题
• 复合逻辑结构：顶层使用and逻辑，嵌套状态和年份各自的or条件组，完全匹配你需要的过滤规则
• 边界处理：当未选中状态/年份时，不添加对应过滤条件；若两者都未选中，则清空过滤器显示全部数据
• 修复原代码bug：统一了网格选择器的大小写（原代码中MyKendoGrid和myKendoGrid不一致），并补全了setYearGridFilters中缺失的循环闭合括号

内容的提问来源于stack exchange，提问作者Irish