显示和隐藏多列
注意:这个需要使用Bottons扩展
把需要显示/隐藏的列的控制进行分组
The show
and hide
parameters of this button are both
column-selectorType
types defining the columns in the table that should be shown or hidden respectively.
If a column is not defined in either, its visibility is not altered.
请注意:不同于其他按钮的是,他没有默认的标题,所以你必须通过
buttons.buttons.textOption
配置按钮上显示的文字
这个按钮有以下选项配置:
名称 | 默认 |
---|---|
className |
buttons-colvisGroup |
按钮的class名称,详情参见
buttons.buttons.classNameOption
|
|
action |
|
设置列的可见性 | |
show |
[] |
配置的列可见 | |
hide |
[] |
从可见列的数组中移除 |
Datatables初始化:使用类名进行分组
$('#myTable').DataTable( { buttons: [ { extend: 'colvisGroup', text: 'Office info', show: '.office', hide: '.hr' }, { extend: 'colvisGroup', text: 'HR info', show: '.hr', hide: '.office' } ] } );
直接初始化:显示/隐藏所有列
$('#myTable').DataTable( { buttons: [ { extend: 'colvisGroup', text: 'Show all', show: ':hidden' }, { extend: 'colvisGroup', text: 'Show none', hide: ':visible' } ] } );
Translation from DataTables.net, with permission