Datatables Pagination not working initially

Question

I have a search form which pulls out various rows from a DB which are then displayed in a table. The code for pulling the rows is working fine. I am using datatables to display in a user-friendly way. The datatables code is working as I can see the search controls etc and the next-previous buttons once the table is filled however the table doesnt appear to be completing pagination on initial load.

There is no "Showing ** to ** of ** entries" text and all rows returned are displayed however once I click the next button or use the display only 10/25/50/100 dropdown pagination kicks in and pagination works perfectly from thereforth. I'm pulling my hair out because this was working for me yesterday and I cant think of what I have changed since to stop it working:

I intialize datatables below

$(document).ready(function() {
    $('#blog-search').dataTable( {
        "aaSorting": [[ 4, "DESC" ]],
        "aoColumnDefs": [
          { "sType": "numeric-comma", "aTargets": [ 2 ] }

        ],
        "bPaginate": true,

    } );
} );

the sorting of the columns also

Is the `** to ** of ** entries` text not showing the only problem? Is it in the DOM even though you can't see it? Are you setting `iTotalDisplayRecords` or `iTotalRecords` ? — Jeemusu, Aug 14 '12 at 09:19
the datatables_info element is in the DOM but it is empty however when I click next for example it displays the correct data and pagination begins. I am not setting iTotalDisplayRecords or iTotalRecords, is this something I need to do? — Daniel Benzie, Aug 14 '12 at 09:25
Can you run your table through the DataTables debugger and give us the debug code please: http://debug.datatables.net . Btw - you've got a trailing comma which IE will reject. — Allan Jardine, Aug 14 '12 at 09:33
I dunno if it matters, but "DESC" doesn't work for me unless it is lowercase. `"aaSorting": [[ 4, "desc" ]],`. With it in all caps i get a `Uncaught TypeError: Property 'string-DESC' of object # — Jeemusu, Aug 14 '12 at 09:41
@AllanJardine I have found the problem now it was as Jeemusu advised it was the DESC in uppercase (if you add an answer I will happily accept it for you). I have also removed the trailing comma for IE. thank you both :) — Daniel Benzie, Aug 14 '12 at 09:45
No worries, I wrote up an answer for you. Do you know how to check your code for javascript errors? I would recommend downloading firebug for firefox, or if you have chrome just do `View -> Developer -> Javascript Console` it will show you any errors, which should help you solve any future problems. — Jeemusu, Aug 14 '12 at 09:50

score 3 · Accepted Answer · answered Aug 14 '12 at 09:48

When I add your code into a jsfiddle I recieved the following error message in the console:

Uncaught TypeError: Property 'string-DESC' of object #<Object> is not a function

On further investigation it appears that the "aaSorting": [[ 4, "DESC" ]], line in your code is the problem. The sort string needs to be in all lower case, I.E. "desc" NOT "DESC".

The working code should be as follows:

$(document).ready(function() {
    $('#blog-search').dataTable( {
        "aaSorting": [[ 4, "desc" ]],
        "aoColumnDefs": [
          { "sType": "numeric-comma", "aTargets": [ 2 ] }

        ],
        "bPaginate": true,

    } );
} );

Datatables Pagination not working initially

1 Answers1