以下是关于“jQWidgets jqxDataTable filterMode属性”的完整攻略，包含两个示例说明：
简介
jqx 控件提供了 filterMode 属性，用于设置表格的筛选模式。通过设置 filterMode 属性，我们可以控制表格的筛选方式，以适应不同的需求。
详细攻略
以下是 jqxDataTable 控件的 filterMode 属性的详细攻略：
filterMode属性
filterMode 属性是 jqxDataTable 控件的一个属性，用于设置表格的筛选模式。该属性包含以下几个选项：
default：默认的筛选模式，支持文本、数字和日期等类型的筛选。advanced：高级筛选模式，支持多个条件的组合筛选。excel：Excel 风格的筛选模式，支持多个条件的组合筛选，并提供了更多的筛选选项。
示例1
在此示例中，我们创建了 jqxDataTable 控件，并使用 filterMode 属性来设置表格的筛选模式为 default。
<div id="jqxdatatable"></div>
<script>
$(document).ready(function () {
// 创建 jqxDataTable 控件
var data = [
{ name: '张三', age: 20, gender: '男', address: '北京市' },
{ name: '李四', age: 25, gender: '女', address: '上海市' },
{ name: '王五', age: 30, gender: '男', address: '州市' },
{ name: '赵六', age: 35, gender: '女', address: '深圳市' },
{ name: '钱七', age:40, gender: '男', address: '杭州市' },
{ name: '孙八', age: 45, gender: '女', address: '南京市' },
{ name: '周九', age: 50, gender: '男', address: '成都市' },
{ name: '吴十', age: 55, gender: '女', address: '重庆市' }
];
var source = {
datatype: 'json',
datafields: [
{ name: 'name', type: 'string' },
{ name: 'age', type: 'number' },
{ name: 'gender', type: 'string' },
{ name: 'address', type: 'string' }
],
localdata: data,
totalrecords: data.length
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#jqxdatatable").jqxDataTable({
columns: [
{ text: '姓名', datafield: 'name' },
{ text: '年龄', datafield: 'age' },
{ text: '性别', datafield: 'gender' },
{ text: '地址', datafield: 'address' }
],
source: dataAdapter,
filterMode: 'default'
});
});
</script>
在上述代码中，我们创建了一个 jqxDataTable 控件，并使用 filterMode 属性来设置表格的筛选模式为 default。
示例2
在此示例中，我们创建了一个 jqx 控件，并使用 filterMode 属性来设置表格的筛选模式为 excel。在表格的 filter 事件中，我们使用 getFilterInformation() 方法来获取筛选信息，并将其显示在另一个 jqxDataTable 控件中。
<div id="jqxdatatable"></div>
<div="result"></div>
<script>
$(document).ready(function () {
// 创建 jqxDataTable 控件
var data = [
{ name: '张三', age: 20, gender: '男', address: '北京市' },
{ name: '李四', age: 25, gender: '女', address: '上海市' },
{ name: '王五', age: 30, gender: '男', address: '州市' },
{ name: '赵六', age: 35, gender: '女', address: '深圳市' },
{ name: '钱七', age: 40, gender: '男', address: '杭州市' },
{ name: '孙八', age: 45, gender: '女', address: '南京市' },
{ name: '周九', age: 50, gender: '男', address: '成都市' },
{ name: '吴十', age: 55, gender: '女', address: '重庆' }
];
var source = {
datatype: 'json',
datafields: [
{ name: 'name', type: 'string' },
{ name: 'age', type: 'number' },
{ name: 'gender', type: 'string' },
{ name: 'address', type: 'string' }
],
localdata: data,
totalrecords: data.length
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#jqxdatatable").jqxDataTable({
columns: [
{ text: '姓名', datafield: 'name' },
{ text: '年龄', datafield: 'age' },
{ text: '性别', datafield: 'gender' },
{ text: '地址', datafield: 'address' }
],
source: dataAdapter,
filterMode: 'excel',
filter: function () {
var filterInfo = $("#jqxdatatable").jqxDataTable('getFilterInformation');
var resultData = data.filter(function (item) {
var match = true;
for (var i = 0; i < filterInfo.length; i++) {
var filter = filterInfo[i];
if (filter.condition === 'CONTAINS_CASE_SENSITIVE') {
match = match && item[filter.datafield].toString().indexOf(filter.value) !== -1;
} else if (filter.condition === 'CONTAINS_CASE_INSENSITIVE') {
match = match && item[filter.datafield].toString().toLowerCase().indexOf(filter.value.toLowerCase()) !== -1;
} else if (filter.condition === 'DOES_NOT_CONTAIN_CASE_SENSITIVE') {
match = match && item[filter.datafield].toString().indexOf(filter.value) === -1;
} else if (filter.condition === 'DOES_NOT_CONTAIN_CASE_INSENSITIVE') {
match = match && item[filter.datafield].toString().toLowerCase().indexOf(filter.value.toLowerCase()) === -1;
} else if (filter.condition === 'EQUAL') {
match = match && item[filter.datafield] == filter.value;
} else if (filter.condition === 'NOT_EQUAL') {
match = match && item[filter.datafield] != filter.value;
} else if (filter.condition === 'GREATER_THAN') {
match = match && item[filter.datafield] > filter.value;
} else if (filter.condition === 'LESS_THAN') {
match = match && item[filter.datafield] < filter.value;
} else if (filter.condition === 'GREATER_THAN_OR_EQUAL') {
match = match && item[filter.datafield] >= filter.value;
} else if (filter.condition === 'LESS_THAN_OR_EQUAL') {
match = match && item[filter.datafield] <= filter.value;
}
}
return match;
});
var resultSource = {
datatype: 'json',
datafields: [
{ name: 'name', type: 'string' },
{ name: 'age', type: 'number' },
{ name: 'gender', type: 'string' },
{ name: 'address', type: 'string' }
],
localdata: resultData,
totalrecords: resultData.length
};
var resultDataAdapter = new $.jqx.dataAdapter(resultSource);
$("#result").jqxDataTable({ source: resultDataAdapter });
}
});
});
</script>
在上述代码中，我们创建了一个 jqxDataTable 控件，并使用 filterMode 属性来设置表格的筛选模式为 excel。在表格的 filter 事件中，我们使用 getFilterInformation() 方法来获取筛选信息，并将其显示在另一个 `jqxDataTable 控件中。