使用datatables按自定义条件筛选数据
来源:互联网 发布:卖家怎么加入爱淘宝 编辑:程序博客网 时间:2024/05/17 07:33
datatables中用自定义条件进行过滤筛选数据的设置方法
使用jquery.datatables.js插件封装表格数据,可以方便快捷地对表格数据进行处理。该插件内置的功能组件诸如:列排序、数据统计、分页、数据过滤(数据查询)在这里不再一一赘述。
需实现的需求:在表格中设置下拉菜单,通过自定义条件(复合条件)的方式进行数据的筛选,如图一:
图一
实现方式之一:
菜单点击事件触发该操作:
1.分别获取各个下拉菜单选中的值,存入数组;
2.将数组转换为字符串赋值给input;
3.通过js操作自动触发input的keyup事件。
源代码:
var type_arr = new Array(3);//定义一个数组,用于存放自定义条件。n根据自定义下拉菜单的个数确定var type_str = new String();$.each($('.h_form .select_box .btn-group'),function(k,v){//遍历各下拉菜单 $(v).on('click','ul li',function(){ type_arr.splice(k,1,$(this).text());//每列条件更新时,新值替换旧值 type_str = type_arr.join(" ");//将数组转换为字符串,用空格连接 $(v).parents('.h_form').find('.dataTables_filter [type=search]').val( type_str ).keyup();//将字符串赋值给input,同时触发其keyup事件,实现数据的过滤筛选 });} );
效果图:
阅读全文
1 0
- 使用datatables按自定义条件筛选数据
- excel 常用使用技巧 二(数据筛选、条件格式、自动换行、自定义序列、自定义单位、冻结窗格)
- MySQL按条件筛选备份还原数据
- GridView多条件筛选数据
- 淘宝按条件筛选
- 复制Datatable结构和数据,并按条件进行筛选
- pandas按若干个列的组合条件筛选数据
- 自定义Lamda表达式作为筛选条件
- jquery.dataTables 按条件查询后重新生成表格 点击排序还是原来的数据问题
- JS前端数据多条件筛选
- 使用Excel筛选数据
- datatables自定义
- Linux 使用grep筛选多个条件
- 谓词 NSPredicate 使用 筛选约束 过滤条件
- 多条件筛选界面DropDownMenu使用总结
- 条件筛选
- 使用Ajax加载数据的dataTables
- 使用dataTables插件从servlet获取数据
- homework
- ServerStyle的应用
- 可折叠TextView控件使用:ExpandableTextView
- combogrid实现分页、动态搜索、过滤手动输入
- textarea字数限制
- 使用datatables按自定义条件筛选数据
- NoSQL简介
- EntityTypeConfiguration
- Deli Deli(简单的STL + 字符串)
- springboot 启动错误 出现Caused by: java.lang.ClassNotFoundException: ch.qos.logback.classic.Level
- 【Python】提取网页正文内容的相关模块与技术
- 格式化输出只有固定小数点后位数
- make隐含规则
- 微信公众号开发(Java) ---- 模板消息接口的使用