Question

我希望能够隐藏所有列，但似乎无法正确使用语法。

从下面的代码和上面的链接中，创建一个显示所有列的按钮。有没有办法写这个，以便我可以隐藏所有列？

        {
            extend: 'colvisGroup',
            text: 'Show all',
            show: ':hidden'
        }

代码：

$(document).ready(function() {
    $('#example').DataTable( {
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'colvisGroup',
                text: 'Office info',
                show: [ 1, 2 ],
                hide: [ 3, 4, 5 ]
            },
            {
                extend: 'colvisGroup',
                text: 'HR info',
                show: [ 3, 4, 5 ],
                hide: [ 1, 2 ]
            },
            {
                extend: 'colvisGroup',
                text: 'Show all',
                show: ':hidden'
            }
        ]
    } );
} );

我尝试了类似下面的其他排列，但没有任何乐趣，任何人都可以提供建议，和/或我如何在文档中找到它。

{
    extend: 'colvisGroup',
    text: 'Show None',
    visibility: false
}

Answer 1

{
    extend: 'colvisGroup',
    text: 'Show None',
    hide: [':gt(1)'],
    //show: [0, 1, 2],
    //hide: [0, 1, 2],
    //hide: ['*']
}

这对我有用，只有2列可见...

Answer 2

这对我有用，虽然我不确定为什么0没有显示第一列。它也可以将其留空show: [],

{
extend: 'colvisGroup',
text: 'Show None',
show: [0],
hide: ['*']
}

Answer 3

首先需要确定数据表中绑定的列数，然后立即将所有列的可见性设置为false。

var oTable = $('#example').DataTable();
var columnCounts = oTable.columns().nodes().length;
for ( var i=0; i<columnCounts; i++ ) {
   oTable.fnSetColumnVis(i, false, false);
}

数据表+隐藏所有列按钮

3 个答案: