Apply different page cache value
Apply different page cache value
Hi,
I'm using page caching as described in the pipelining example in my table.
It order to make my pages load quicker, I want to be able to cache 2 pages on first load (page 1) and when a user clicks further pages (page 3+) it cache 6 pages.
My attempt is not working as I expected. I'm calling getPageCache (L#16) and I can see the console.log (L#5) is showing true on first load and drawing 2 pages, but when I click on page 3+ I don't see the console.log and it continues to draw 2 pages.
I'm setting isFirstDraw=true on page load (L#2), and then setting it to false in the drawCallback (L#37),
Please note, this is a simplified version of the code
Is it possible to do this, what am I doing wrong?
Thank you for your time.
$(document).ready(function(){
var isFirstDraw = true;
function getPageCache(firstDraw) {
console.log(firstDraw);
return (firstDraw ? 2 : 6);
}
var dataTableObj = $('#dataTable').DataTable( {
"processing" : true
,"serverSide" : true
,"pageLength" : 10
,"responsive" : true
,"ajax" : $.fn.dataTable.pipeline({
url : '/remote/performersList?method=getPerformersList'
,pages : getPageCache(isFirstDraw)
,method : 'POST'
,data : function(d){
d.selectedLHB = $('select[name="availableLHB"] option:selected').val();
}
})
,"language" :{ "emptyTable" : localisedText.emptytable
,"info" : localisedText.info
,"infoEmpty" : localisedText.infoempty
,"infoFiltered" : localisedText.infofiltered
,"lengthMenu" : localisedText.lengthmenu
,"loadingRecords" : localisedText.loadingrecords
}
,"initComplete": function () {
checkScreenSize ( datatable = dataTableObj
,isChevronVisible = isChevronVisible
);
$('.page-link').attr('rel', 'nofollow');
$("#performersList").removeClass("disable");
}
,"drawCallback": function( settings ) {
isFirstDraw = false;
checkScreenSize ( datatable = dataTableObj
);
$('.page-link').attr('rel', 'nofollow');
var searchButton = $('button[type="submit"]#plSearchButton');
searchButton.val(searchButtonText);
searchButton.prop('disabled', false);
}
,"preDrawCallback": function( settings ) {
var searchButton = $('button[type="submit"]#plSearchButton');
searchButton.val(localisedText.processing);
searchButton.prop('disabled', true);
}
});
});
Answers
Sounds like getPageCache() is being called during Datatables initialization not when the ajax request is being sent. Basically you are calling the function to set the initial value. Try creating an anonymous function, similar to the
ajax.data
option and calling getPageCache() inside that function. This way you are assigningpages
the function not the return value of the first call.Kevin
Hi Kevin,
I've tried the following and nothing happening, is what I'm doing wrong?
I've created my anonymous function L#4 and calling it on line L#16. This throws an error in the page called via the ajax but it's unrelated to datatables
and I've also tried this, done away with the anonymous function and just added the logic to L#12. This does the same as my original attempt.
Hi Kevin,
I couldn't update the comment above
I've tried the following and nothing happening, is what I'm doing wrong?
I've created my anonymous function L#4 and calling it on line L#16. This throws an error in the page called via the ajax but it's unrelated to datatables
This does works and returns a static value similar to my original attempt. This is the same code as above with a change to L#15
and I've also tried this, done away with the anonymous function and just added the logic to L#12. This does the same as my original attempt.
I messed with it a little and couldn't find a way to make the
pages
option dynamic. Maybe @allan or @colin can provide the necessary steps to do so.Kevin
To be honest, it isn't something I'd considered before. I'm sure it will be possible, but as it is specific customisation, this is something that would fall under our support packages.
Allan
thank you for your feedback.
D