I tried using infinite scroll jquery data tables to display data on my server. I have a large collection of data on the server that is not fixed (the number of records increases every day, so there is no fixed amount on how much data is present). I am trying to show it in a Twitter-style page, and not in a regular paginated Google-style one. My code looks below. With this code, I can load the source data. But I could not find any resource on how the second call can be launched when the scroller reaches the end of the current table and adds a new result to the same table. Is there any function that dataTables provide to detect the end of the scroll. Or do we need to write a scroll event and determine if the scroller reached the end of the table?
var table = $("#events-table").dataTable({
"bProcessing": true,
"bServerSide": true,
"sScrollY": 100,
"aoColumns": [
{ "sTitle": "col1" },
{ "sTitle": "col2" }
]
"fnServerData": function (sSource, aoData, fnCallback) {
$.ajax({
url : "http://linkToAccessServer" + pagenumber,
type : 'post',
success : function(data){
var tableData = {};
tableData.iTotalRecords = data.totaldata;
tableData.aaData = [];
for(var i = 0; i < data.data.length; i++){
var tableInnerArray = [];
tableInnerArray.push(data.data.col1);
tableInnerArray.push(data.data.col2);
tableData.aaData.push(tableInnerArray);
}
fnCallback(tableData);
}
});
}
});