After redraw datatable from ajax request it comes back on first page

saikatsarkar

Hi Allen,

Thanks for such a great plugin. I am loading data on next page click event and it is loading perfectly but after redraw the table it's back to first page. Please suggest how do I solved this problem. Thanks in advance.

// ON PAGE CLICK NEW DATA IS LOADED TO THE DATATABLE
$('#example').on('page.dt', function(){
//table.bResetDisplay = false;
loadmoredata(table.page.info().recordsDisplay); // LOAD MORE DATA FROM DATABASE
//table.fnDisplayStart=table.page.info().start; // NOT WORKING
//table.fnStandingRedraw(); // NOT WORKING
//table.iDisplayStart(table.page.info().start); // NOT WORKING
//table.stateSave=true; // NOT WORKING
});

// DATATABLE INITIALIZE
table = $('#example').DataTable({
"pagingType":"simple",
//"stateSave": true,
"oLanguage": {
"sInfo": "<b>START-END </b>of <b>TOTAL</b>",
"sInfoFiltered": "",
"sLengthMenu": '<b>Show</b> <select class="selectpicker">'+
'<option value="10">10</option>'+
'<option value="20">20</option>'+
'<option value="30">30</option>'+
'<option value="40">40</option>'+
'<option value="50">50</option>'+
'<option value="-1">All</option>'+
'</select>',
"sSearch": "",
"oPaginate": {
"sPrevious": "<",
"sNext": ">"
}
},
"fnDrawCallback": function( oSettings ) {
// CALLING EVERY EVENT CHANGED IN DATATABLE
//console.log($('#example tbody tr').length);
selectedCheckboxCnt();
},
"dom": '<"row" <"col-md-12" <"col-md-8"><"col-md-1 nopadding"l><"col-md-2 nopadding"i><"col-md-1"p>>><"row" <"col-md-12"t>><"row" <"col-md-12" <"col-md-9"><"col-md-2 nopadding"i><"col-md-1 pull-right "p>>>',
//"dom": '<"row" <"col-md-12" <"col-md-2"><"col-md-3"l><"col-md-3"f><"col-md-2"i><"col-md-2"p>>><"row" <"col-md-12"t>><"row"<"col-md-9"><"col-md-1 nopadding"i><"col-md-2 pull-right "p>>',
"columnDefs": [
{ targets: [0,4,5], sortable: false }
]
});

// AJAX REQUEST
function loadmoredata(datacount){
$.ajax({
type: "POST",
url: "/user/ajaxdatalaod1",
data: 'datacount='+$('#example tbody tr').length,
success: function(data) {
$('#example').dataTable().fnAddData(JSON.parse(data));
}
});
return false;
}