重置剑道多过滤器复选框数据源以反映过滤后的数据

Posted 2023-05-07

【中文标题】重置剑道多过滤器复选框数据源以反映过滤后的数据

【英文标题】：Reset kendo Multi filter checkbox dataSource to reflect filtered data

【发布时间】：2015-06-30 04:26:25

【问题描述】：

我正在尝试过滤多个字段的数据源。我的网格上有一个 Kendo Multi 过滤器复选框选项。我为每一列初始化每个 Kendo 多重过滤器。

之后，我使用这样的 javascipt 函数应用过滤器，并将网格的数据设置为过滤后的数据。

function filterGrid() 
    var grid = $("#grid").data('kendoGrid');
    var filter = [];
    filter.push( field: "ratingPlace", operator: "startswith", value: "US" );
    grid.dataSource.filter(filter);
    grid.dataSource.data(grid.dataSource.view());

因此该函数将过滤器应用于网格。现在当我点击剑道多重过滤器选项时，旧数据源中的所有数据都会出现在过滤器列表中。

我怎样才能避免这种情况？我只需要过滤后的数据仅在过滤后的列表中可用，而不是在整个 dataSource 项中可用。我没有这个 在执行 filterGrid() 函数后初始化 Kendo 多个复选框过滤器时出现问题。有什么办法可以重新初始化源 ("kendoFilterMultiCheck") 的每一列？？我附上了一个 jsfiddle 示例来演示。

1) 首先通过单击具有初始数据源的列标题来初始化所有过滤器多复选框 2）点击过滤按钮 3) 数据源被替换 4) 使用新数据源点击过滤器多重检查 - 旧过滤器数据出现在列表中

http://jsfiddle.net/Sbb5Z/1712/

【问题讨论】：

您找到这个问题的答案了吗？我有同样的问题，我需要根据在单独列上选择的过滤器刷新 ColumnMenu 多重过滤器

【参考方案1】：

我的建议是为多过滤器复选框定义自定义数据源，然后调用其读取方法以重新加载数据。

$("th.k-filterable[data-field='ratingPlace']").data().kendoFilterMultiCheck.checkSource.read();

Reload Multiselect Filter Box when grid data changes

【参考方案2】：

这基本上是调整 Telerik 论坛上给出的 solution 并将其更改为使用本地网格数据而不是单独的数据源。该代码还对新的过滤器数据进行排序（这是我遇到的原始问题）。

  function removeDuplicates(items, field) 
     var getter = function (item)  return item[field] ;
     var result = [];
     var index = 0;
     var seen = ;

     while (index < items.length) 
        var item = items[index++];
        var text = getter(item);

        if (text !== undefined && text !== null && !seen.hasOwnProperty(text)) 
           result.push(item);
           seen[text] = true;
        
     

     return result;
  

  function onFilterMenuOpen(e) 
     // Refresh and Sort the multi-filter selections
     if (e.field == "ratingPlace") 
        // Build up list of unique values for this column
        var gridView = $("#grid").data("kendoGrid").dataSource.view();
        var uniqueDsResult = removeDuplicates(gridView, e.field);

        // Empty the existing filter and populate with new data
        var filterMultiCheck = this.thead.find("[data-field=" + e.field + "]").data("kendoFilterMultiCheck")
        filterMultiCheck.container.empty();
        filterMultiCheck.checkSource.data(uniqueDsResult.sort());
        filterMultiCheck.createCheckBoxes();