deferred render question
deferred render question
Hi, I was wondering what kind of data source you need to use with deferred rendering. I have turned on the option expecting that if I display 100 rows at a time the performance should be similar to a table with ~300 rows. This is not playing out though.
Edit: not 300 in this case since only ~6 rows are showing with a 200px window. My understanding is only the displayed rows, and an equal number above and below are rendered by default.
My question would be then, do I need to use the Ajax data source with server side processing ( like the manual's example) or can I just pass it a javascript array like I am doing?
Here is the example code I am using for table creation. Datatables Live is currently giving me a 503 error, and I cannot link to the webpage directly.
[code]
var numCols = 15;
var numRows = 8000;
var aoColumns = [];
var rows = [];
for (var i= 0; i < numCols; i++)
{
aoColumns[i] = { "sTitle" : "column #"+i }
}
for (var i = 0; i < numRows; i++)
{
var new_row = [];
for (var j = 0; j < numCols; j++)
{
new_row.push(j);
}
rows.push(new_row);
}
this.$('table').dataTable({
"aoColumns" : aoColumns,
"aaData" : rows,
"bPaginate" : false,
"bFilter" : true,
"bSort" : true,
"sScrollY" : "200px",
"bDeferRender": true
});
[/code]
Edit: not 300 in this case since only ~6 rows are showing with a 200px window. My understanding is only the displayed rows, and an equal number above and below are rendered by default.
My question would be then, do I need to use the Ajax data source with server side processing ( like the manual's example) or can I just pass it a javascript array like I am doing?
Here is the example code I am using for table creation. Datatables Live is currently giving me a 503 error, and I cannot link to the webpage directly.
[code]
var numCols = 15;
var numRows = 8000;
var aoColumns = [];
var rows = [];
for (var i= 0; i < numCols; i++)
{
aoColumns[i] = { "sTitle" : "column #"+i }
}
for (var i = 0; i < numRows; i++)
{
var new_row = [];
for (var j = 0; j < numCols; j++)
{
new_row.push(j);
}
rows.push(new_row);
}
this.$('table').dataTable({
"aoColumns" : aoColumns,
"aaData" : rows,
"bPaginate" : false,
"bFilter" : true,
"bSort" : true,
"sScrollY" : "200px",
"bDeferRender": true
});
[/code]
This discussion has been closed.
Replies
Edit: I see why this works now. The entries are put into pages so it only loads 1 page at a time. The scroll bar is for the page displayed. I was hoping to have all the rows in the table with no pages. It looks like Scroller (https://datatables.net/blog/Introducing_Scroller_-_Virtual_Scrolling_for_DataTables) is the only way to do that?
Allan