jQuery数据表隐藏列

有没有一种方法与jQuery数据表插件来隐藏（和显示）表列？

我想出了如何重新加载表数据：使用fnClearTable和fnAddData 。

但我的问题是，在我对表格的一种看法（例如隐藏模式）中，我不想显示某些列。

Answer 1

您可以通过以下命令隐藏列：

 fnSetColumnVis( 1, false ); 

第一个参数是列的索引，第二个参数是可见性。

通过： http : //www.datatables.net/api – 函数fnSetColumnVis

Answer 2

如果有人再次进入这里为我工作…

 "aoColumnDefs": [{ "bVisible": false, "aTargets": [0] }] 

Answer 3

您可以在数据表初始化过程中定义这个

 "aoColumns": [{"bVisible": false},null,null,null] 

Answer 4

对于任何使用服务器端处理和使用隐藏列将数据库值传递给jQuery的人，我build议使用“sClass”参数。 你将能够使用CSS显示：none来隐藏列，同时仍然能够检索其值。

CSS：

 th.dpass, td.dpass {display: none;} 

在数据表init：

 "aoColumnDefs": [ { "sClass": "dpass", "aTargets": [ 0 ] } ] // first column in visible columns array gets class "dpass" 

//编辑：记得添加你的隐藏类到你的单元格也

Answer 5

dynamic隐藏列

以前的答案是使用传统的DataTables语法。 在v 1.10+中，可以使用column（）。visible（） ：

 var dt = $('#example').DataTable(); //hide the first column dt.column(0).visible(false); 

要隐藏多列，可以使用columns（）.visible（） ：

 var dt = $('#example').DataTable(); //hide the second and third columns dt.columns([1,2]).visible(false); 

这是一个小提琴演示 。

在表初始化时隐藏列

要在初始化表时隐藏列，可以使用columns选项：

 $('#example').DataTable( { 'columns' : [ null, //hide the second column {'visible' : false }, null, //hide the fourth column {'visible' : false } ] }); 

对于上述方法，您需要为应保持可见的列指定null ，并且没有指定其他列选项。 或者，您可以使用columnDefs来定位特定的列：

 $('#example').DataTable( { 'columnDefs' : [ //hide the second & fourth column { 'visible': false, 'targets': [1,3] } ] }); 

Answer 6

你可以尝试如下来隐藏/显示dynamic运行时

隐藏 ：fnSetColumnVis（1，false，false）;

例如： oTable.fnSetColumnVis（item，false，false）;

显示 ：fnSetColumnVis（1，true，false）;

例如： oTable.fnSetColumnVis（item，false，false）;

在这里，oTable是Datatable的对象。

Answer 7

随着API可以使用

 var table = $('#example').DataTable(); table.column( 0 ).visible( false ); 

看这个信息：

在这里input链接描述

Answer 8

注意：接受的解决scheme现在已经过时，是遗留代码的一部分。 http://legacy.datatables.net/ref这些解决scheme可能不适合那些使用DataTables的新版本的人（现在是其遗留的）。对于较新的解决scheme：可以使用：; https ： //datatables.net/reference/ API /列（）。可见（）

你可以实现一个button的替代方法： https ： //datatables.net/extensions/buttons/built-in看看提供的链接下的最后一个选项，允许有一个button，可以切换列的可见性。

Answer 9

 $(document).ready(function() { $('#example').DataTable( { "columnDefs": [ { "targets": [ 2 ], "visible": false, "searchable": false }, { "targets": [ 3 ], "visible": false } ] });}); 

Answer 10

看看我的解决scheme

我有这个HTML table Head

 <thead> <tr> <th style="width: 20%">@L("Id")</th> <th style="width: 20%">@L("IdentityNumber")</th> <th style="width: 20%">@L("Name")</th> <th style="width: 20%">@L("MobileNumber")</th> <th style="width: 20%">@L("RegistrationStatus")</th> <th style="width: 20%">@L("RegistrationStatusId")</th> <th style="width: 20%; text-align: center;" data-hide="phone">@L("Actions")</th> </tr> </thead> 

和我的Ajax request返回这样的东西

所以我想隐藏Id索引[0]和RegistrationStatusId索引[5]

 $(document).ready(function() { $('#example').dataTable( { "columnDefs": [ { "aTargets": [0, 5], "sClass": "invisible"},// here is the tricky part ] }); }); 

我希望这会帮助你