KendoUI分组过滤器

时间:2016-04-16 14:58:46

标签: javascript filter kendo-ui grid

我正在尝试为KendoUI网格制作分组过滤器。我必须创建一个文本字段,按名称过滤网格和一个kendo数字字段,按库存中的单位过滤网格。

我如何制作分组过滤器?

我尝试了以下但是它不起作用 - 错误的请求404错误:

$('body').bind('keyup mouseup', '#UnitsInStock', function () {
  var value = $('#UnitsInStock').val();
  var val = $('#ProductName').val();


  if (value) {
    grid.data("kendoGrid").dataSource.filter(myFilters(val, value));
  } else {
    grid.data("kendoGrid").dataSource.filter();
  }

});

function myFilters(name='', price='') {


  var filters = {
    logic: "or",
    filters: [
      { field: "ProductName", operator: "startswith", value: name},
      { field: "UnitsInStock", operator: "gte", value: price}
    ]                                        


  }
  return filters;

}
<div id="grid"></div>
  <script type="text/x-kendo-template" id="template">
       <div class="toolbar">
      <label for="category">Search by Product Name:</label>
      <input type="search" id="ProductName" />
       <input id="UnitsInStock"  type="number" />
    </div>
  </script>

1 个答案:

答案 0 :(得分:1)

由于您要对多个类型进行过滤,因此请确保在创建过滤器对象时保留类型。例如,您可以预定义过滤器字段..

@Override
    public void onStart(final FileAlterationObserver observer) {

        Thread.currentThread().setName("monitorThread");

并获取用户输入

var filterFields = [{ field: "Units", type: "number" }, { field: "Name", type: "string" }]

以及生成类似于此

的过滤器的方法
var searchString = // user input

最后,过滤你的网格

var getFilter = function (filterFields, searchString) {
        var filterInt = function (value) {
            if (/^(\-|\+)?([0-9]+|Infinity)$/.test(value))
                return true;
            return false;
        }

        var filters = [];
        var i = 0;
        for (var i = 0; i < filterFields.length; i++) {
            if (filterFields[i].type === "string") {
                filters.push({
                    field: filterFields[i].field,
                    operator: "startswith",
                    value: searchString.toString()
                });
            }
            if (filterFields[i].type === "number") {
                if (filterInt(searchString)) {
                    filters.push({
                        field: filterFields[i].field,
                        operator: "gte",
                        value: parseInt(searchString)
                    });
                }
            }
        }

        return {
            logic: "or",
            filters: filters
        };
    }

另外,为确保您的终端正常工作,请使用postman等工具并执行GET(grid.data("kendoGrid").dataSource.filter(getFilter(filterFields, searchString)) )。