jQWidgets jqxTreeGrid 可过滤属性

简介

jQWidgets jqxTreeGrid是一款用JavaScript编写的高性能jQuery插件。它是一个类似树形结构的网格，支持分组，排序，筛选等多种功能。本文主要介绍jqxTreeGrid中的可过滤属性，这个属性可以让用户更方便的筛选数据。

可过滤属性

可过滤属性是指可以给jqxTreeGrid添加筛选功能，通过定义数据筛选规则来过滤数据。可过滤属性一般包括以下几个部分：

1. filterable

定义了是否启用过滤功能。当该属性为true时，表示启用过滤功能，为false时表示禁用过滤功能。

2. filterMode

定义了过滤器的模式，包括三种：default，advanced和excel-style。其中default是默认模式，按照设定的规则进行筛选；advanced是高级模式，可以更精确的定义筛选条件；excel-style是Excel风格的筛选功能，可以通过下拉菜单来筛选数据。

3. filterRowHeight

定义了筛选行的高度，即在树型网格顶部显示的筛选行的高度，默认为35px。

4. filterDelay

定义了筛选操作的延迟时间，以毫秒为单位，默认为500ms。

5. filterModeSelected

定义了默认的筛选模式，包括以上提到的三种模式，默认为default。

属性示例

以下是一个含有可过滤属性的jqxTreeGrid程序示例。

$("#jqxTreeGrid").jqxTreeGrid({
    width: '100%',
    source: dataAdapter,
    sortable: true,
    filterable: true,
    filterMode: 'advanced',
    filterRowHeight: 50,
    filterDelay: 1000,
    filterModeSelected: 'default',
    columns: [
      { text: '姓名', dataField: 'name' },
      { text: '性别', dataField: 'gender' },
      { text: '年龄', dataField: 'age' },
      { text: '出生日期', dataField: 'born' }
    ]
});

注意事项

在使用可过滤属性时，需要注意以下几个问题：

1. 使用可过滤属性需要引入jquery.jqwidgets.min.js和jqxgrid.filter.js两个JS文件。
2. 如果可过滤属性中的filterable属性为true，则在jqxTreeGrid的顶部会出现一个默认的筛选行，用户可以通过这个筛选行来筛选数据。
3. 在advanced模式下，用户可以自己输入筛选规则，所以必须保证输入的规则正确。
4. 在excel-style模式下，如果不使用该模式提供的下拉菜单筛选功能，则任何输入都无法起到筛选效果。

结束语

可过滤属性是jqxTreeGrid非常实用的一个属性，可以让用户更方便的筛选数据。当然，除了可过滤属性以外，jqxTreeGrid还有其他很多功能，如分组，排序等，值得程序员们深入探究。