bPaginate and ColVis do not play nice together
bPaginate and ColVis do not play nice together
I've done quite a bit of troubleshooting and research here (my second FULL day using dataTables), trying many ideas that other folks mentioned. This may help, so I'm posting here, and perhaps someone can teach me something, too! In summary, when I had bPaginate set to false and I used ColVis to select and deselect columns, as mentioned before, it must have been re-calling the AJAX (oh... serverside data in mysql) back to the database every time to re-render the table. I narrowed it down to bPaginate specifically by commenting/uncommenting things... and that would still show my the pagination numbers and stuff, which I didn't like... and then I found an sDom (no matter how long I stare at that I still haven't figured it out completely (yeah, I read about it, too) !!!! lol) that worked... Anyway... here it is... real basic so far:
[code]
@import "./media/css/demo_table.css";
@import "./media/css/demo_table_jui.css";
@import "./extras/ColVis/media/css/ColVis.css";
.ColVis {
float: left;
margin-bottom: 0
}
.dataTables_length {
width: auto;
}
<!-- jquery 1.10... but you still need jquery 1.8 !! -->
<!-- this next line is an older jquery 1.8.2 and I cannot seem to make various things work without it!! -->
<!-- call jquery UI AFTER jquery or you getting a warning error "})( jQuery );" -->
$(document).ready(function() {
$('#example').dataTable( {
"sScrollY": "600px",
"bScrollCollapse": true,
//"bPaginate": false,
"bDeferRender": true,
"bStateSave": true,
"bJQueryUI": true,
"sDom": '<"H"C<"toolbar">fr>t<"F"iS>',
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "./server_processing.php",
});
$("div.toolbar").html(" insert DrawLegendTable here. ");
});
and then the table and header and all that here
[/code]
so... about 3000 rows and 17 columns... and when I try to use ColVis to select/unselect columns, it's REAL slow... unusably slow. So the fix, for me, is:
[code]
//"bPaginate": false,
"sDom": '<"H"Cfr>t<"F"iS>',
[/code]
Mainly the sDom excluding the "l"
I hope that helps someone!!! I also tried using the latest NIGHTLY's and stuff... ColVis changed some functionality (clicking backdrop to close) I didn't like so I reverted back.
oh - and THANKS ALAN! I'm loving what I'm seeing so far!
[code]
@import "./media/css/demo_table.css";
@import "./media/css/demo_table_jui.css";
@import "./extras/ColVis/media/css/ColVis.css";
.ColVis {
float: left;
margin-bottom: 0
}
.dataTables_length {
width: auto;
}
<!-- jquery 1.10... but you still need jquery 1.8 !! -->
<!-- this next line is an older jquery 1.8.2 and I cannot seem to make various things work without it!! -->
<!-- call jquery UI AFTER jquery or you getting a warning error "})( jQuery );" -->
$(document).ready(function() {
$('#example').dataTable( {
"sScrollY": "600px",
"bScrollCollapse": true,
//"bPaginate": false,
"bDeferRender": true,
"bStateSave": true,
"bJQueryUI": true,
"sDom": '<"H"C<"toolbar">fr>t<"F"iS>',
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "./server_processing.php",
});
$("div.toolbar").html(" insert DrawLegendTable here. ");
});
and then the table and header and all that here
[/code]
so... about 3000 rows and 17 columns... and when I try to use ColVis to select/unselect columns, it's REAL slow... unusably slow. So the fix, for me, is:
[code]
//"bPaginate": false,
"sDom": '<"H"Cfr>t<"F"iS>',
[/code]
Mainly the sDom excluding the "l"
I hope that helps someone!!! I also tried using the latest NIGHTLY's and stuff... ColVis changed some functionality (clicking backdrop to close) I didn't like so I reverted back.
oh - and THANKS ALAN! I'm loving what I'm seeing so far!
This discussion has been closed.