具有响应式扩展的DataTables列可见性

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>