Server side processing on Datatable
Server side processing on Datatable
yogesh1001
Posts: 7Questions: 0Answers: 0
I am getting error in the following code as oTable is null or not an object .
when i remove ("bProcessing": true , "bServerSide": true, ) this part its working fine but with this no data will be disaplayed and it ll go in infinite loop just saying " processing "
HTML code :
script :
var jsonColumnData = [ { "sTitle": "Browser", sClass: "alignCenter" },
{ "sTitle": "Engine", sClass: "alignCenter" },
{ "sTitle": "Grade", sClass: "alignCenter" },
{ "sTitle": "Platform", sClass: "alignCenter"},
{ "sTitle": "Version", sClass: "alignCenter" },
{ "sTitle": "checkbox", sClass: "alignCenter" }];
$(document).ready(function() {
oTable = $('#example').dataTable( {
"sDom": 'lfr<"scroller"t>p',
"bPaginate" : false,
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "./GetJSONdata.do",
"aoColumns":jsonColumnData,
"sScrollY": "800px",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* ... additional variables ... */
alert("Before call");
fnAddAjaxData(sSource,aoData,fnCallback);
after("after call");
}
} );
function fnAddAjaxData(sSource,aoData,fnCallback)
{
var rowDataArray=[];
oLoadParams.iLock = true;
$.getJSON(
oTable.fnSettings().sAjaxSource +
"?iStart="+ oLoadParams.iDataStart +
"&iLength="+ oLoadParams.iDataLength,
function(json) {
var data1 =$.each(json.aaData, function(i, n){
var myArr=[];
myArr.push(n.browser);
myArr.push(n.engine);
myArr.push(n.grade);
myArr.push(n.platform);
myArr.push(n.version);
myArr.push(n.checkbox);
rowDataArray.push(myArr);
});
rowDataArray.splice(0,1);
//oTable.fnClearTable();
oTable.fnAddData(rowDataArray);
//oTable.fnDraw();
alert("Before sEcho");
if ( json.sEcho == 1 )
{
$(".dataTables_wrapper tfoot th").each( function (i) {
/* Insert the select menu */
this.innerHTML = fnCreateSelect(json.select[i]);
/* Add the event listener for the newly created element */
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
} );
}
oLoadParams.iDataStart = oLoadParams.iDataStart + json.aaData.length;
oLoadParams.iLock = false;
fnCallback(json);
}
);
}
function fnCreateSelect( aData )
{
alert("fnCreateSelect>>>>");
var r='', i, iLen=aData.length;
for ( i=0 ; i
when i remove ("bProcessing": true , "bServerSide": true, ) this part its working fine but with this no data will be disaplayed and it ll go in infinite loop just saying " processing "
HTML code :
script :
var jsonColumnData = [ { "sTitle": "Browser", sClass: "alignCenter" },
{ "sTitle": "Engine", sClass: "alignCenter" },
{ "sTitle": "Grade", sClass: "alignCenter" },
{ "sTitle": "Platform", sClass: "alignCenter"},
{ "sTitle": "Version", sClass: "alignCenter" },
{ "sTitle": "checkbox", sClass: "alignCenter" }];
$(document).ready(function() {
oTable = $('#example').dataTable( {
"sDom": 'lfr<"scroller"t>p',
"bPaginate" : false,
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "./GetJSONdata.do",
"aoColumns":jsonColumnData,
"sScrollY": "800px",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* ... additional variables ... */
alert("Before call");
fnAddAjaxData(sSource,aoData,fnCallback);
after("after call");
}
} );
function fnAddAjaxData(sSource,aoData,fnCallback)
{
var rowDataArray=[];
oLoadParams.iLock = true;
$.getJSON(
oTable.fnSettings().sAjaxSource +
"?iStart="+ oLoadParams.iDataStart +
"&iLength="+ oLoadParams.iDataLength,
function(json) {
var data1 =$.each(json.aaData, function(i, n){
var myArr=[];
myArr.push(n.browser);
myArr.push(n.engine);
myArr.push(n.grade);
myArr.push(n.platform);
myArr.push(n.version);
myArr.push(n.checkbox);
rowDataArray.push(myArr);
});
rowDataArray.splice(0,1);
//oTable.fnClearTable();
oTable.fnAddData(rowDataArray);
//oTable.fnDraw();
alert("Before sEcho");
if ( json.sEcho == 1 )
{
$(".dataTables_wrapper tfoot th").each( function (i) {
/* Insert the select menu */
this.innerHTML = fnCreateSelect(json.select[i]);
/* Add the event listener for the newly created element */
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
} );
}
oLoadParams.iDataStart = oLoadParams.iDataStart + json.aaData.length;
oLoadParams.iLock = false;
fnCallback(json);
}
);
}
function fnCreateSelect( aData )
{
alert("fnCreateSelect>>>>");
var r='', i, iLen=aData.length;
for ( i=0 ; i
This discussion has been closed.
Replies