隐藏jQuery dataTables中的列?

时间:2017-08-17 11:05:36

标签: javascript jquery datatables

我想隐藏jQuery DataTables中包含地理区域th中的列。这就是我在做的事情:

$(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);
     }
        }
    });

加载了dataTable,但该列未被隐藏。 在这之前我尝试在表格渲染时隐藏它并且它工作正常。我当时做的是:

 "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);
                           }
                       }
                       },

但它有一个问题,它在表加载时显示隐藏的列。为了避免这个问题,我使用了首先提到的解决方案。但它没有工作,虽然我正在使索引正确。它没有任何错误。

3 个答案:

答案 0 :(得分:2)

它不必如此复杂。只需给列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 );

查看列选择器 - &gt;的 https://datatables.net/reference/type/column-selector

答案 1 :(得分:0)

您想要隐藏包含地理区域的列。

尝试这样的事情

$('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();
            }
          });
         });
        }
      });
    });

请参阅demo

答案 2 :(得分:0)

获取数据表对象

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 );

DataTable Documentation