本文介绍如何使用EasyUI DataGrid插件中的过滤功能，通过添加combobox类型的过滤器实现对DataGrid中'salaryType'和'payStatus'字段的动态过滤，并详细展示了如何根据选择值实时更新过滤条件。
下载datagrid-filter.js
在加载datagrid后，加上以下代码：
$("#dgsap").datagrid('enableFilter');
$('#dgsap').datagrid('enableFilter', [{
field:'salaryType',
type:'combobox',
options:{data:[
{'id':'0','value':'0','text':'--全部--'},
{'id':'1','value':'a','text':'aaa'},
{'id':'2','value':'b','text':'bbb'},
{'id':'3','value':'c','text':'ccc'}],
onChange:function(value){
if (value == '0'){
$("#dgsap").datagrid('removeFilterRule', 'salaryType');
} else {
$("#dgsap").datagrid('addFilterRule', {
field: 'salaryType',
op: 'contains',
value: value
});
}
$("#dgsap").datagrid('doFilter');
}
} ,
op: ['contains']
},{
field:'payStatus',
type:'combobox',
options:{data:[
{'id':'','value':'0','text':'全部'},
{'id':'0','value':'未付','text':'未付'},
{'id':'1','value':'已付','text':'已付'}],
onChange:function(value){
if (value == '0'){
$("#dgsap").datagrid('removeFilterRule', 'payStatus');
} else {
$("#dgsap").datagrid('addFilterRule', {
field: 'payStatus',
op: 'contains',
value: value
});
}
$("#dgsap").datagrid('doFilter');
}
} ,
op: ['contains']
｝
注意 ，下面的op包含的过虑方式应该包括上面op的过虑方式，不然过虑无作用
扫一扫
3万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
