javascript - DataTables Colvis Responsive -


looking how combine datatables colvis extension , responsive. search in past versions impossible. wondering if there's progress or if found way make them work together. i'm looking do: keep responsive ability of table (to shrink , extend on different window sizes) , able select columns visible. can make desired column hidden, when changing window size columns became visible , responsive overrides colvis settings.

i found solutions implementing buttons extension column visibility , responsive extension. have use buttons extension, because colvis retired.

first solution add both extension together, works. link.
need set width of table 100%.

<table id="example" class="display" cellspacing="0" width="100%"> 
$('#example').datatable( {     dom: 'bfrtip',     buttons: [         'colvis'     ],     responsive: true } ); 

next solution: link
have add responsive classes tag table , in javascript call buttons colvis extension.

<table id="example" class="display responsive nowrap" width="100%">  $(document).ready( function () {   var table = $('#example').datatable({     dom: 'bfrtpi',     buttons: [         'colvis',         'colvisrestore'     ],     columns: [       null,       {visible: false}     ]   }); }); 

testing easy - after click button column visibility try change width of output div (or browser window) , columns hiding or showing width of window.


Comments