隐藏 jQuery 数据表中的列?



我想隐藏jQuery DataTablesth中包含地理区域的列。这就是我正在做的:

$(document).ready(function(){
if(geo_zone_on_off==0){
var _index=$("#datatable_ajax .heading th:contains(GeoZone)").index();
var oTable=$("#datatable_ajax").DataTable();
if(_index != -1){
oTable.column(_index).visible(false);
}
}
});

数据表已加载,但列未被隐藏。 在执行此操作之前,我试图在呈现表格时隐藏它并且它工作正常。我当时所做的是:

"initComplete": function(settings, json) {
if(geo_zone_on_off==0){
var _index=$("th.sorting:contains(GeoZone),th.no-sort:contains(GeoZone)").index();
if(_index != -1){
grid.getDataTable().column(_index).visible(false);
}
}
},

但是它有一个问题,即它在加载表时显示隐藏列。为了避免这个问题,我使用了首先提到的解决方案。但是尽管我索引正确,但它不起作用。它不会给出任何错误。

它不必那么复杂。只需给列一个name。为什么不在初始化时设置visible状态?:

columnDefs: [
{ targets: <index>, name: 'geozone', visible: geo_zone_on_off == 1 }
]

然后,稍后,您可以通过引用列名称来更改可见性:

table.column('geozone:name').visible(false);

table.column('geozone:name').visible( geo_zone_on_off == 1 );

查看列选择器 ->https://datatables.net/reference/type/column-selector

获取数据表对象

var table = $('#table').DataTable();

获取列目标以更改可见性

var target = //Get target of column to hide for eg for third column target = 2
var column = table.column( target );

改变可见性

column.visible( false );

数据表文档

您要隐藏包含 Geo Zone 的列。

尝试这样的事情

$('table').DataTable();
$('button').on('click',function(){
$('th').each(function(i,e){
if($(this).text()=='No') {
$(this).hide();
$('tr').each(function(){
$(this).find('td').each(function(index,element){
if(index==i) {
$(this).hide();
}
});
});
}
});
});

观看演示

最新更新