JQuery DataTables .Net Server Side Pagination Issues

Question

I'm working on a bug fix right now for an application at work where the prior developer (since gone) didn't bother to paginate the data results on a page meant specifically for listing out data results.

This of course has reared it's ugly head as users are starting to see long running script errors in IE. This, combined with the sheer data volume size, is making web pages nearly useless.

Fast forward to my attempts to fix it and they've gone pretty well. The site is a .NET MVC 2 site that was developed using DataTables to add search/sort/paging functionality on the client. I'd just completed a similar task using jqGrid so figured this would be relatively straight forward. And it has been except one small problem. I cannot for the life of me get page links to generate.

A quick results view:

The results know that there are 2086 records in this query:

But paging links are not generated.

My action method is returning JSON via

return Json(new
              {
                 param.sEcho,
                 iTotalRecords = totalRecords,
                 iTotalDisplayRecords = filteredContracts.Count(),
                 aaData = result
              },
           JsonRequestBehavior.AllowGet);

where

param.sEcho = "1", iTotalRecords = 2086, iTotalDisplayRecords = 25, and aaData is the array result of data to display

To be thorough, he's the datatable initialize statement:

    $("#tblToDoItems").dataTable({
        'bServerSide': true,
        'bProcessing': true,
        'sAjaxSource': '/Home/GetContractList',
        "bJQueryUI": true,
        "bAutoWidth": false,
        "bPaginate": true,
        "sPaginationType": "full_numbers",
        "iDisplayLength": 25,
    /* make the first and last columns not sortable */
        "aoColumnDefs": [
            { "bSortable": false, "aTargets": [0, -1] }
        ]
    });

Am I missing some setting that would prevent DataTables from properly generating pagination via server side data retrieval?

Answer 1

Your iTotalDisplayRecords is equal to 25, so datatables think that there are only 25 contracts on the server side and second page is not needed because all of them are already shown on the current page. This is comon mistake - if you take a look at the JQuery MVC tutorial section Implementation of server-side paging you will see that there are three numbers:

1. iTotalRecords = allCompanies.Count() representing all entries in the database (in your case 2086)
2. iTotalDisplayRecords = filteredCompanies.Count() representing the number of the records that match the current search condition. If you didn't used filtering this number should be same as the iTotalRecords 2086, but in yourcase it is 25.
3. result.Count - this is 25. This number is not passed in the JSON response because DataTables already knows that there should be 25 records per page.

If you put all.Count insteadof the result.Count into the iTotalDisplayRecords DataTables will show paging. iTotalDisplayRecords and iTotalRecords are used to show message "Showing 1 to 25 of iTotalDisplayRecords (iTotalRecords in total)"

If iTotalDisplayRecords is equal to 25, DataTables will show message "Showing 1 to 25 of 25 (iTotalRecords in total)", and assume that there is no page 2; hence, paging will be disabled, as in your example.

Jovan