Lazy loading of table rows in Jquery datatables 1.

Question

I am using jquery datatable 1.10.10. Is there any options for lazy loading of row data in datatable. For example , if the datatable contains 50 row of records,  if I scroll the datatable till the end, it requests for another 50 rows of data and appends to already existing datatable ? 

Answer 1

Lazy loading can be achieved with Scroller extension and server-side processing, see Scroller - Server-side processing example.

For example:

$(document).ready(function() {
    $('#example').DataTable( {
        serverSide: true,
        ordering: false,
        searching: false,
        ajax: '/path/to/script',
        scrollY: 200,
        scroller: {
            loadingIndicator: true
        }
    } );
} );

Alternatively I have developed PageLoadMore plug-in that allows to replace default pagination control with "Load more" button. See this answer or jQuery DataTables: "Load more" button article for more examples and details.