Kendo UI Grid - 动态添加/删除过滤器

Question

我需要创建一个Kendo ui网格。由于这有很多过滤器，我需要有4个常规过滤器，休息应该能够根据用户的选择动态添加。有人可以就此提供帮助吗？

Answer 1

为了按文本框过滤，您可以挂钩keyUp事件以检索值。然后，您可以将其添加为现有filter对象的过滤器。

$('#NameOfInput').keyup(function () {
    var val = $('#NameOfInput').val();
    var grid = $("#yourGrid").data("kendoGrid");
    var filter = grid.dataSource.filter();
    filter.filters.push({
        field: "NameOfFieldYouWishToFilter",
        operator: "eq",
        value: val,
        FilterName: "UniqueIdentifierForFilter"
    });
    grid.dataSource.filter(filters);
});

使用下拉框，您可以使用onChange事件获得所需的功能，使用$('#yourDropDown').val();获取值。

FilterName是可选的，您需要额外的逻辑来添加/删除过滤器。即，您可以使用它来确定过滤器中是否已存在过滤器，如果是，您可以使用splice将其删除。

修改

使用FilterName，您可以搜索过滤器是否已存在并将其删除：

var filterIndex = filter.filters.map((e: any) => { return e.FilterName }).indexOf("UniqueIdentifierForFilter");
if (filterIndex > -1)
{
    filter.filters.splice(filterIndex, 1);
}