JQuery Datatables FixedColumns
JQuery Datatables FixedColumns
mvidhyavmrk
Posts: 1Questions: 0Answers: 0
I developed a JSP page using JQuery, Datatables and FixedColumns plugins. I need a datatable in my page, with first 4 columns fixed, and all other columns movable.
To load a simple jsp page of 80 rows * 133 columns datatable, it took 1 min and 1 sec in IE 8, whereas it took few seconds in firefox and chrome(though it has alignment issues).
And my js code looks like this:
[code]
$(document).ready(
function() {
oTable = $('#example').dataTable(
{
"sScrollX" :"100%",
"sScrollY" :"500px",
"sScrollXInner" :"130%",
"bScrollCollapse" :false,
"bJQueryUI" :true,
"bAutoWidth" :false,
"fnDrawCallback" : function(oSettings) {
if (oSettings.bSorted|| oSettings.bFiltered) {
for ( var i = 0, iLen = oSettings.aiDisplay.length; i < iLen; i++) {
$('td:eq(0)',oSettings.aoData[oSettings.aiDisplay[i]].nTr).html(i + 1);
}
}
},
"sPaginationType" :"full_numbers",
"bPaginate" :true,
"bProcessing" :true,
"bServerSide" :true,
"aaSorting" : [ [ 1, 'asc' ] ],
"sAjaxSource" :"./server_processing.jsp",
"fnServerData" : function(sSource,aoData, fnCallback) {
$.ajax( {"dataType" :'json',"type" :"POST","url" :sSource,"data"
:aoData,"success":fnCallback
});
}
});
new FixedColumns(oTable, {
"iLeftColumns" :4,
"iLeftWidth" :450,
"sHeightMatch" :"auto"
});
});
[/code]
Only after adding sScrollX,sScrollY,sScrollXInner, the page started slowing down in IE 8. Also without that, FixedColumns doesnt work.
I used jquery-1.6.1.js, jquery.datatables 1.8, and jquery Fixedcolumns 2.0. Any help would be appreciated for improving the performance with jquery + datatables + FixedColumns.
I tried adding height in css and gave "sHeightMatch" :"none", but this took even greater time to load.
Also, i tried the one given by Dennis in the below link, still it took the same time to load.
http://stackoverflow.com/questions/2406192/how-to-speed-up-the-reading-of-innerhtml-in-ie8
Pls help, I am not sure where i am going wrong.
Thanks
To load a simple jsp page of 80 rows * 133 columns datatable, it took 1 min and 1 sec in IE 8, whereas it took few seconds in firefox and chrome(though it has alignment issues).
And my js code looks like this:
[code]
$(document).ready(
function() {
oTable = $('#example').dataTable(
{
"sScrollX" :"100%",
"sScrollY" :"500px",
"sScrollXInner" :"130%",
"bScrollCollapse" :false,
"bJQueryUI" :true,
"bAutoWidth" :false,
"fnDrawCallback" : function(oSettings) {
if (oSettings.bSorted|| oSettings.bFiltered) {
for ( var i = 0, iLen = oSettings.aiDisplay.length; i < iLen; i++) {
$('td:eq(0)',oSettings.aoData[oSettings.aiDisplay[i]].nTr).html(i + 1);
}
}
},
"sPaginationType" :"full_numbers",
"bPaginate" :true,
"bProcessing" :true,
"bServerSide" :true,
"aaSorting" : [ [ 1, 'asc' ] ],
"sAjaxSource" :"./server_processing.jsp",
"fnServerData" : function(sSource,aoData, fnCallback) {
$.ajax( {"dataType" :'json',"type" :"POST","url" :sSource,"data"
:aoData,"success":fnCallback
});
}
});
new FixedColumns(oTable, {
"iLeftColumns" :4,
"iLeftWidth" :450,
"sHeightMatch" :"auto"
});
});
[/code]
Only after adding sScrollX,sScrollY,sScrollXInner, the page started slowing down in IE 8. Also without that, FixedColumns doesnt work.
I used jquery-1.6.1.js, jquery.datatables 1.8, and jquery Fixedcolumns 2.0. Any help would be appreciated for improving the performance with jquery + datatables + FixedColumns.
I tried adding height in css and gave "sHeightMatch" :"none", but this took even greater time to load.
Also, i tried the one given by Dennis in the below link, still it took the same time to load.
http://stackoverflow.com/questions/2406192/how-to-speed-up-the-reading-of-innerhtml-in-ie8
Pls help, I am not sure where i am going wrong.
Thanks
This discussion has been closed.