DataTables column visibility with Responsive extension

Question

I am quite new in jQuery DataTables. I just read about responsive table feature provided by DataTables, see this example.

Here columns are hiding on window resizing but the problem is that last column is also hiding. Can we define which column must be hidden on different window sizes?

Answer 1

See Class logic for fine-grained control on when each column would be visible.

For example, to always show last column:

$(document).ready(function(){
    $('#example').DataTable({
       responsive: true,
       columnDefs: [
          targets: -1,
          className: 'all'
       ]
    });
});

where columnDefs.targets set to -1 points to last column (column index counting from the right), and className: 'all' indicates that column will always be visible, regardless of the browser width.

Answer 2

If you can edit the HTML, you can add the data-priority="1" attribute to the th element you want NOT to be hidden. Ex:

<th data-priority="1">Last column</th>