表过滤器控制

Bootstrap Table的表过滤器控制扩展

使用插件:bootstrap-table-filter-control

如果使用datepicker 选项,则依赖:bootstrap-datepicker v1.4.0

用法

<link rel="stylesheet" type="text/css" href="extensions/filter-control/bootstrap-table-filter-control.css">
<script src="extensions/filter-control/bootstrap-table-filter-control.js"></script>

选项

filterControl

  • 类型: Boolean

  • 详情:

    设置为true以在列中添加inputselect

  • 默认: false

filterDataCollector

  • 类型: Function

  • 详情:

    收集将添加到选择过滤器的数据,以过滤例如以逗号分隔并用格式化程序显示的标签。

  • 默认: undefined

alignmentSelectControlOptions

  • 类型: String

  • 详情:

    设置选择控制选项的alignemnt。使用使用left, rightauto.

  • 默认: undefined

hideUnusedSelectOptions

  • 类型: Boolean

  • 详情:

    设置为true以隐藏表中没有的选项。此选项不适用于服务器端分页。

  • 默认: false

disableControlWhenSearch

  • 类型: Boolean

  • 详情:

    如果要在服务器响应数据时禁用控件,则设置为true。如果sidePagination是“server”,则此选项将起作用。

  • 默认: false

searchOnEnterKey

  • 类型: Boolean

  • 详情:

    设置为true以在用户按Enter键时触发搜索操作。

  • 默认: false

列选项

filterControl

  • 类型: String

  • 详情:

    设置input: 显示输入控件, select:显示选择控件,datepicker:显示一个datepicker控件。

  • 默认: undefined

filterData

  • 类型: String

  • 详情:

    设置自定义选择过滤器值,用于var:variable从变量url:http://www.example.com/data.json加载或从远程json文件json:{key:data}加载或从json字符串加载。

  • 默认: undefined

filterDefault

  • 类型: String

  • 详情:

    设置过滤器的默认值。

  • 默认: undefined

filterDatepickerOptions

  • 类型: Object

  • 详情:

    如果设置了datepicker选项,请使用此选项配置带有本机选项的datepicker。用这种方式:data-filter-datepicker-options='{"autoclose":true, "clearBtn": true, "todayHighlight": true}'.

  • 默认: undefined

filterStrictSearch

  • 类型: Boolean

  • 详情:

    如果要使用严格搜索模式,请设置为true。

  • 默认: false

filterStartsWithSearch

  • 类型: Boolean

  • 详情:

    如果要在搜索模式下使用启动,请设置为true。

  • 默认: false

filterControlPlaceholder

  • 类型: String

  • 详情:

    设置此项以便仅在输入过滤器控件中显示占位符。

  • 默认: ''

filterOrderBy

  • 类型: String

  • 详情:

    设置此选项可在选择控件中对选项进行排序,无论是升序还是降序。

  • 默认: 'asc'

Icons

  • 清除:‘glyphicon-trash icon-clear’

本地

formatClearFilters

  • 类型: Function

  • 默认: function () { return "Clear Filters";}

方法

onColumnSearch(column-search.bs.table)

  • 我们在搜索列数据时触发

onCreatedControls(created-controls.bs.table)

  • 我们在搜索列数据时触发

方法

triggerSearch

  • 手动触发搜索操作

clearFilterControl

  • 清除此插件添加的所有控件(类似于filterShowClear选项)。