Bootstrap-table 表头筛选控件,根据Bootstrap-table API,在表头添加筛选排序,支持文本搜索,数值搜索,日期搜索,单选和复选。
依赖js jQuery,Bootstrap,Bootstrap-table,select2
筛选类型说明
1. 文本类型(text)
提供模糊搜索功能,根据输入的参数模糊匹配返回对应的结果
2. 数值类型(num)
提供区间搜索功能,所搜列必须为数值,可以搜索最小值和最大值之间的结果,也可以搜索所有大于最小值或小于最大值的结果。
3. 日期类型(date)
提供区间搜索日期功能,使用方法同数值类型。
4. 单选(radio)
如图所示,根据所选项筛选出对应的结果。
5. 复选(checkbox)
与单选功能相同,但可以搜索多个选项。
参数说明
表格参数 | 默认值 | 说明 |
---|---|---|
data-advanced-sortable | false | 默认false。设为true开启控件功能 |
列参数 | 默认值 | 说明 |
---|---|---|
data-sortable | false | 默认false。设为true开启排序功能,bootstrap-advanced-sortable.js控件开启后会覆盖bootstrap-table默认的筛选功能 |
data-search-type | - | 可选参数,设置开启搜索功能。可选值:text,num,date,radio,checkbox。 |
data-search-select | - | 传值参数,只有当搜索类型设为radio和checkbox时才生效,要求输入数组类型。样例:data-search-select=["选项1","选项2","选项3"] |
github链接:https://github.com/Westsyan/bootstrap-advanced-sortable