Rearranging visible columns when clicking on tab when table has 50 columns and 50000 records
Rearranging visible columns when clicking on tab when table has 50 columns and 50000 records
Capamania
Posts: 233Questions: 81Answers: 5
I have one table with 50 columns and showing about 50000 records. When clicking on a certain bootstrap tab I want to make different columns visible.
The below works ... but it always takes 2 or 3 seconds to adjust the columns when clicking on the tab. Is there another way to speed this up?
table_all = $('#table-all').DataTable( {
dom: "Blrtip",
ajax: {
url: "/source.php",
type: "POST",
data: function (d) {
...
} },
serverSide: true,
processing: true,
columns: [
/* 50 columns */
order: [[ 0, 'asc' ]]
lengthMenu: [25, 50, 100, 250]
} );
$("#tableTabs a[data-toggle=\"tab\"]").on("shown.bs.tab", function (e) {
var newTab = $(e.target).attr('aria-controls');
selectedTab = newTab;
if ( selectedTab == 'firsttab') {
table_all.columns( [ 2,3,4,5,6,7,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46 ] ).visible( false );
table_all.columns( [ 0,1,8,9,10,11,12,13,14,15,16,17 ] ).visible( true );
}
if ( selectedTab == 'secondtab') {
table_all.columns( [ 2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46 ] ).visible( false );
table_all.columns( [ 0,1,18,19,20,21,22,23,24 ] ).visible( true );
}
});
This discussion has been closed.
Answers
Are you using the latest version of DataTables? There were performance issues with column visibility in older versions.
Beyond that, I'd need to be able to profile the page to see if there is anything that can be done.
Allan
Thanks Allan. I'm using the DataTables-1.10.13 versions (main + extension). I'll update the packages .... and provide you a link if it didn't help. Regards