Question

我有一个与onabai相同的多选网格列（太棒了！）我需要在该列上放置过滤器菜单。

http://onabai.wordpress.com/2013/07/17/kendoui-multiselect-in-a-grid-yes-we-can/

我在多值列

上添加了自定义过滤器

  filterable: {
    ui: function(element) {
      element.kendoDropDownList({
        dataSource: [ "London", "Surat", "New York"]  //etc
      });
    }

过滤器显示在网格列上，但过滤器不会过滤。我想，我需要以某种方式捕获过滤器更改事件并根据所选值过滤数据源。

任何指针？

感谢。

Answer 1

我花了一些时间来掌握，但你可以使用kendoGrid自定义过滤器。

我已经创建了一个函数来将multiselect设置为UI及其过滤函数：

function userFilter(element) {
console.log(element);
element.removeAttr("data-bind");
  //$scope.kGrid.dataSource.query({ filter: filter });

  $scope.userFilterElement = element.kendoMultiSelect({
      dataSource: $scope.users,
      optionLabel: "--Select Value--",
      change: function(e){
        var filter = { name: "user", logic: "or", filters: [] };
        var values = this.value();
        $.each(values, function(i, v) {
          filter.filters.push({field: "user", operator: "eq", value: v });
        });
        //$scope.kGrid.dataSource.filter(filter);
        if ($scope.gridFilter.filters[0] && $scope.gridFilter.filters[0].name == 'user'){
          if (filter.filters.length > 0)
            $scope.gridFilter.filters.splice(0,1,filter);
          else
           $scope.gridFilter.filters.splice(0,1);

        }
        else
          $scope.gridFilter.filters.push(filter);
        $scope.kGrid.dataSource.filter($scope.gridFilter);
      }
  });

}

这是一个相对粗糙和基本的例子，我为简化代码阅读而简化。这是一个有效的代码：http://plnkr.co/edit/8N1oNpsd10CJwBrWKpK3?p=preview 网格加载后，单击“添加数据”几次，然后过滤用户并使用多个变量。希望这会有所帮助。

如何使用包含多选的列来过滤kendo网格 - 多个值？

1 个答案: