博客

jQWidgets jqxTreeGrid filterMode属性

  • Post category:jquery

jQWidgets jqxTreeGrid filterMode属性

jqxTreeGrid 是 jQWidgets 提供的一个树形表格组件，它可以展示层级结构的数据支持多种交互操作。jqxTreeGrid 提供了 filterMode 属性，用于设置过滤模式。

filterMode属性

filterMode 属性用于设置过滤模式。它接受一个字符串，表示过滤模式。可选值有 "default" 和 "advanced"。当该属性设置为 "default" 时，jqxTreeGrid 会在表头显示简单的过滤器控件，用户可以通过该件对表格数据进行过滤。当该属性设置为 "advanced" 时，jqxTreeGrid 会在表头显示高级的过滤器控件，用户可以通过该控件对表格数据进行更加复杂的过滤。

示例说明

下面是两个示例，展示如何使用 filterMode 属性设置过滤模式：

示例 1

$('#treeGrid').jqxTreeGrid({
    source: data,
    columns: [
        { text: 'ID', dataField: 'id', width: 100 },
        { text: '名称', dataField: 'name', width:200 },
        { text: '数量', data: 'quantity', width: 100 }
    ],
    filterMode: 'default'
});

在这个示例中，我们创建了一个 jqxTreeGrid 组件，并设置 source 属性为一个数据源。然后，我们定义了三个列。最后，设置 filterMode 属性为 "default"，使用简单的过滤器控件。

示例 2

$('#treeGrid').jqxTreeGrid({
    source: data,
    columns: [
        { text: 'ID',Field: 'id', width: 100 },
        { text: '名称', dataField: 'name', width:200 },
        { text: '数量', dataField: 'quantity', width: 100 }
    ],
    filterMode: 'advanced'
});

在这个示例中，我们同样创建了一个 jqxTreeGrid 组件，并设置 source 属性为一个数据源。然后，我们定义了三个列最后，我们设置 filterMode 属性为 "advanced"，使用高级的过滤器控件。

总结

以上就是 jqxTreeGrid 组件的 filterMode 属性的详细讲和示例。通过设置 filterMode 属性，我们可以设置过滤模式，方便用户对表格数据进行筛选和查找。

Tags: