您的位置:首页 > 产品设计 > UI/UE

EasyUI使用心得——datagrid的条件查询,过滤

2017-03-24 17:04 776 查看
在页面初始化时加入过滤代码和过滤条件:

dg.datagrid('enableFilter', [{
field:'docTypeName',
type:'combobox',
options:{
panelHeight:'auto',
data:[{value:'{这是查询时候的value值}',text:'查询的时候显示的文本内容'},{value:'',text:''}],
onChange:function(value){
if (value == ''){
dg.datagrid('removeFilterRule', 'docTypeName');
} else {
dg.datagrid('addFilterRule', {
field: 'docTypeName',
op: 'equal',
value: value
});
}
dg.datagrid('doFilter');
}
}
},{
field:'fontType',
type:'textbox',
options:{precision:1},
op:['equal','notequal','less','greater']
}
]);


datagrid的定义:

<table id="dg" title="水印配置信息" class="easyui-datagrid" style="width:100%;height:auto"
pagination="true" url='获取的url' remoteFilter="true"
pageSize="20"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="id"  hidden="true"></th>
//这里继续写你的所有列
</tr>
</thead>
</table>


这里实现的还有两种过滤方式,官方文档中还有更多。。。

EasyUI官方demo
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  easyui datagrid