jQuery数据表隐藏列没有从DOM中删除它

Question

我需要隐藏一列从显示在jquery数据表。当我使用bVisible属性隐藏列时，它会从DOM中消失。

我想将列的表单元格的显示属性设置为none，以便值不出现在视图中，但它们仍然应该存在于DOM中，因为我隐藏的列唯一地标识行，我需要知道行选择上的唯一ID。如何做到这一点。

我正在使用aaData属性使用服务器端分页填充表。

看过这个问题，但是这些选项把它从DOM中删除了。Jquery数据表隐藏列

Answer 1

您应该将className与columnDefs或列一起使用，

在你的css中像这样定义hide_column类

.hide_column {
    display : none;
}

您有两种方法来分配.hide_column类:

使用columnDefs(将自定义类分配到第一列):

$('#example').DataTable( {
  columnDefs: [
    { targets: [ 0 ],
      className: "hide_column"
    }
  ]
} );

OR columns

$('#example').DataTable( {
  "columns": [
    { className: "hide_column" },
    null,
    null,
    null,
    null
  ]
} );

从这里取的代码片段

---

老回答

尝试添加

"sClass": "hide_column"

Answer 2

以Daniel的回答为基础:

css:

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

:

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

请记住将隐藏类也添加到head单元格中:

<thead>
    <th class="hide_me">First Column</th>
    <th>Second Column</th>
    <th>Third Column</th>
</thead>

如果您正在使用服务器端处理，并且希望从ajax源传入数据，而不希望在数据表中显示数据，那么

也是一个有用的策略。您仍然可以在前端检索列的值，而不需要显示它。有助于通过隐藏的数据值等进行过滤

的例子:

// In datatables init file
<script>
    var filteredValues = [];
    $('td.your_filtering_class').each(function(){
        var someVariable = $(this).find('.hide_me').html();
        filteredValues.push(someVariable);
    }
</script>

Answer 3

如果你想隐藏多个列:

$('#example').dataTable({
  "columnDefs": [{ 
    "targets": [0,1,3], //Comma separated values
    "visible": false,
    "searchable": false }
  ]
});

Answer 4

这是我对u的贡献。

不确定代码是否正确，但它的工作。

如果你像我一样有多个设置列。

$('#example').dataTable( {
  "columnDefs": [ {
        "targets"  : 'no-sort',
        "orderable": false,
        "order": [],
    }],
    "columnDefs": [ {
        "targets"  : 'hide_column',
        "orderable": false,
        "order": [],
        "visible": false
    }]
} );

Answer 5

您可以使用hide方法

$(element).hide();

显示元素，使用show:

方法

$(element).show();

要获得想要的列，可以使用jquery中的n-th child选择器。