Help regarding "Showing entries in Datatable"

pradeepkmr

Hi,
First of all, I really appreciate the wonderful plugin - Datatable. Great work :) I am new to Datatable and want to control the showing entries of the datatable. In my application, i have to load a large amount of data. In order to cut down the performance overhead, we are doing ajax call on ever y page click ( four_button plugin ) returning 50 records. I have set iTotalRecords (say 3457) , iTotalDisplayRecords (say 50) parameters in aaData in the response. I have gone through the documentation several times to find out the parameter to control them. but, i couldn't find the correct one. iDisplayStart is always at 0. so, on every button (first, next,previous,last) click, the data (50 records) gets loaded successfully. but, it always show (1-50 of 3457 records). Please let me know any pointers / references / examples. Any insight is highly appreciated.

[code]
oTable = $('#opportunityData').dataTable

(
{
"bServerSide": true,
"iDisplayStart":$("#pagenum").val(),
"sScrollY" : 425,
"bFilter" : true,
"sDom" : 'rt<"bottom"lip><"clear">',
"bProcessing" : true,
"bDestroy" : true,
"sAjaxSource" : appPath + "data/opportunity/search.html",

"fnServerParams" : function(aoData) {

aoData.push({
"name" : "resultsql",
"value" : resultsql
});
aoData.push({
"name" : "jobdept",
"value" : jobdept
});
aoData.push({
"name" : "edulevel",
"value" : edulevel
});
aoData.push({
"name" : "explevel",
"value" : explevel
});
aoData.push({
"name" : "Statedes",
"value" : statecode
});
aoData.push({
"name" : "currentdistrict",
"value" : districtcode
});
aoData.push({
"name" : "instname",
"value" : instName
});
aoData.push({
"name" : "pageno",
"value" : pageno
});
aoData.push({
"name" : "isSearch",
"value" : isSearch
});
},
"fnInitComplete" : function() {
$('.dataTables_scroll').find('.dataTables_scrollBody')
.niceScroll({

cursorborder : 'none',

cursorcolor : "#CCCCCC",
autohidemode : false

});
// custom scroll bars
// $('.dataTables_scroll').find('.dataTables_scrollBody').mCustomScrollbar({
// scrollButtons:{
// enable:true
// }
//});
$('.dataTables_scrollHeadInner').css("width", "100%");
$('.display').css("width", "100%");
$("select").addClass("chzn-drop-up");
// $("select").addClass("chzn-select");

$(".chzn-drop-up").trigger("liszt:updated");
$(".chzn-drop-up").chosen1();
var config = {
'.chzn-select' : {},
'.chzn-select-deselect' : {
allow_single_deselect : true
},
'.chzn-select-no-single' : {
disable_search_threshold : 10
},
'.chzn-select-no-results' : {
no_results_text : 'Oops, nothing found!'
},
'.chzn-select-width' : {
width : "95%"
}
}
for ( var selector in config) {
$(selector).chosen(config[selector]);
}

},

"sPaginationType" : "four_button",
"bJQueryUI" : true,
"aoColumnDefs" : [

{
"bSearchable" : true,
"bVisible" : false,
"aTargets" : [ 8 ]
} ],
//"sDom": 'T<"clear">lfrtip',/*Task ID : SF00004*/
"oTableTools" : {/*Task ID : SF00004*/
"sSwfPath" : appPath
+ "resources/js/copy_csv_xls_pdf.swf",
"aButtons" : [ {
"sExtends" : "pdf",
"sButtonText" : "Export as PDF",
//"sPdfMessage": "22/07/2013",

"mColumns" : [ 0, 1, 2, 3, 4, 5, 6, 7 ]
}, {
"sExtends" : "xls",
"sButtonText" : "Export to Excel",

"mColumns" : [ 0, 1, 2, 3, 4, 5, 6, 7 ]
}, ]
},
"oLanguage" : {
"sSearch" : "Search all columns:",
"sLoadingRecords" : "Please wait - loading..."
},
"bAutoWidth" : false,
"aoColumns" : [ {
sWidth : "10%",
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "gridwrap"
}, {
sWidth : '10%',
"sClass" : "centeralign"
}

]
});
//oTable.fnDraw();
//oTable.fnStandingRedraw();

}
[/code]

allan

Can you show me your JSON response please? The key thing here is that iDisplayRecords and iDisplayTotalRecords _must_ be the same _unless_ filtering is applied. If there is no filtering, then they are the same number.

Allan

pradeepkmr

Yeah, we have made it to the same number. There is no filtering happening now.

For example say two records, the JSON response would be

[code]
[{"iTotalDisplayRecords":2,"iTotalRecords":2,"aaData":[["TeachAgent900","www.RInstOne.com<\/a>","TST55093<\/a>","Head of Department","Applied Science","Chennai","Ph.D.","13+ Years","10174","<\/a>"],["TeachAgent900","www.RInstOne.com<\/a>","TST55094<\/a>","Head of Department","Applied Science","Chennai","Ph.D.","13+ Years","10174","<\/a>"]]}]
[/code]

allan

That looks fine. If that is what you are doing, then I don't really understand the problem. Can you link to a test case please.

Allan

pradeepkmr

I like to load data on demand. only on clicking the next page the next set of records will be loaded. When i click Next is used some logics and filtered the next 50 records and loaded the grid. Now the problem is idisplaystart is always 0. so datatable displays showning 1 to 50 of 5000 entries always in all the cases. I will set iTotalRecords as 5000 and iTotalDisplayRecords 50.

allan

Right - that's using DataTables outside its supported parameters. Probably possible, but not a supported action. Also, server-side processing will only load the required rows. You might be interested in server-side processing with pipelining: http://datatables.net/release-datatables/examples/server_side/pipeline.html

Allan

pradeepkmr

Thank you. I got it and done in the server side concept.It was my mistake i have written some logic's and trying to change the displaystart variables from server side. I was wondering all it is handled just by bserverside true.