Hide column in jQuery dataTables?

Question

I want to hide a column in jQuery DataTables that contains Geo Zone in its th. This is what I am doing :

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

The dataTable is loaded but the column does not get hidden. Before doing this I tried to hide it when the table was rendered and it worked fine. What I did then was:

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

But it had a problem that it displayed the hidden columns when the table was loading. In order to avoid that issue I used the solution mentioned first. But it is not working although I am getting the index right. It does not give any error.

Answer 1

It dont have to be so complicated. Simply give the column a name. And why not set the visible status upon initialization? :

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

Then, later on, you can change the visibility by refer to the columns name :

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

or

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

Look at column selectors -> https://datatables.net/reference/type/column-selector