Jquery DataTables infinite scroller - function call when the scroller reaches the bottom

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);
        }
        });


      }
  });
+3

All Articles