CODEWITHSUNDEEP
jquerydatatablevisible
user1006072
user1006072

Reputation: 963

jQuery datatable - using column index, check if a column in jQuery datatable is visible/present

Since my earlier post did not get any response, I am reposting this.

I am using jQuery's datatable and I occasionally toggle the visiblity of some of the columns using the below code

tableId.fnSetColumnVis(0, false);

Having done that, there are some other controls on the UI that I have to toggle the visibility for. So, I need to check (Say on page load) if the column with 0 index is visible/hidden/present - whatever. I am looking for something like $("#tableId").isColumnVisible(columnIndex);

Please advise. Thanks

Upvotes: 0

Views: 4780

Answers (2)

cherrynoise
cherrynoise

Reputation: 21

Okay no one managed to answer your question really and i too was looking for this trivial task and it took me longer than expected to find out how to do it.

here's how, really easy but not documented properly.

 /* Get the DataTables object again - this is not a recreation, just a get of the object*/
var oTable = $('#example').dataTable();

var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
oTable.fnSetColumnVis( iCol, bVis ? false : true );

so essentially, the fnSettings() function also has the aoColumns property available which will hold all column properties set on initialization.

if you have trouble getting the correct index from a visible column you can try using this method (though it doesn't seem to work for header th's only body cells so you'll have to do some computing to figure out the header cell).

$('.dataTable td').click( function () {
// Get the position of the current data from the node
var oTable = $(this).closest('.dataTable').dataTable();
var aPos = oTable.fnGetPosition( this );
console.log(aPos);
} );

Upvotes: 1

andreapier
andreapier

Reputation: 2958

I do not know jquery datatable at all but i guess you can just check if the header has the css' display property set to hide. Sample code:

if($("#tableId .th-1").css("display")=="none"){
   //do hidden related action
} else {
   //do visible related action
}

supposing that the column that you are checking has class th-1. If you want a more general approach i can suggest this:

$("#tableId th").each(function(index, element){

    if($(this).css("display")=="none"){
       //do hidden related action
    } else {
       //do visible related action
    }

});

This will check for every th of your table.

Upvotes: 1

Related Questions