Jquery Datatable conditionally hide a column-CodePudding

I am trying to hide a Datable column when a condition is met. Here is what I have discovered and I am a bit lost.

Aproach 1 - this proves the theory I was testing but the column is always hidden (as expected)

var userTable = DataTable(this.$('#someTable'),{
 "bLengthChange" : true,
 "bInfo" : true,
"aoColumns" : [
  { "mDataProp" : function(d){
     return ("Test" || "N/A";
   }, "bVisible" : false, "bSortable" : true, sName : "Column1"
},
{ "mDataProp" : function(d){
     return ("Test" || "N/A";
   }, "bVisible" : true, "bSortable" : true, sName : "Column2"
},

]
}

Approach 2 : Using ternary operator - Column is always visible. How can I fix this ?

 var userTable = DataTable(this.$('#someTable'),{
 "bLengthChange" : true,
 "bInfo" : true,
"aoColumns" : [
  { "mDataProp" : function(d){
     return ("Test" || "N/A";
   }, "bVisible" : function(d){return  true ? 1 : false}, "bSortable" : true, sName : "Column1"
},
{ "mDataProp" : function(d){
     return ("Test" || "N/A";
   }, "bVisible" : true, "bSortable" : true, sName : "Column2"
},

I am at a loss of what am I doing wrong (there has to be something really simple that I am missing).

Thank you

CodePudding user response：

Can you do something like this on button click or using a datatable callback?

var dt = $('#someTable').DataTable();    
//hide the first column
dt.column(0).visible(false);

CodePudding user response：

If you want to hide/show the column of the data table then you may try the below approach:

You can use simple jquery to hide and show the column.

Create an array for the number of total columns. For example, here I have taken 2 column tables.

visibility_arr = [ false, false ];
if(your condition here)
{
    visibility_arr[0]   = true;  
} else {
    visibility_arr[1]   = true;  
}

And In your data table

table = $('#datatable_list').DataTable({
    columns: [
        { data : 'your_column_0', name : 'your_column_0', 'width' : 220, 'visible' : visibility_arr[0] },
        { data : 'your_column_1', name : 'your_column_1', 'width' : 220, 'visible' : visibility_arr[1] },
    ], 
});