Jquery DataTable 的學習之隐藏和顯示列（三）

2017-01-17 15:13:37

在大資料量的前提下，會出現列很多的情況，浏覽器會呈現出滾動條，但是使用者需要看到的并不一定是所有的資訊，那麼就需要對表格的資料進行篩選，在前面的文章中介紹到了搜尋和排序，這都是對資料的篩選功能，但是列數過多會導緻使用者檢視資料非常麻煩。如果可以将不想看到的列隐藏掉就可以了，下面來看一下代碼。

$(document).ready(function() { 
$('#example').dataTable( { 
"aoColumnDefs": [ 
{ "bSearchable": false, "bVisible": false, "aTargets": [ 2 ] }, 
{ "bVisible": false, "aTargets": [ 3 ] } 
] } ); 
} );           

複制

可以通過這種初始化的方式來進行隐藏列，但是這種方式不靈活，有時候需要使用者來決定哪列顯示，哪列不顯示，需要動态的來執行。該插件為我們提供了如下的解決方式。

先進行表格的初始化操作。

$(document).ready(function() { 
   var myTable = $('#example').dataTable(); 
} );           

複制

然後在進行隐藏或者是顯示操作

myTable.column(0).visible(false)//将第一列的資料隐藏
myTable.column(1).visible(true)//讓第二列的資料顯示           

複制

這樣在初始化之後，再通過觸發事件就可以實作動态控制某列隐藏或者是顯示了。