JQuery Datatable moving the pagination to the top

Mary picture Mary · Jul 14, 2014 · Viewed 13.7k times · Source

I am trying to move the pagination property to the upper right hand side of the table. I understand that I have to use the dom property.

 $(document).ready( function () {   
    $('#myTbl').dataTable({   
        "bInfo":true,
        "bJQueryUI": true,
        "bProcessing": true,
         "bPaginate" : true,
         "aLengthMenu": [[50,100,150,200,250,300,-1], [50,100,150,200,250,300,"All"]],
        "iDisplayLength": 50,
        "sPaginationType": "full_numbers",
        "dom": '<"top"flp>rt<"bottom"i><"clear">'           

    });
});

I thought by using flp on top would make those options appear on top, however the pagination appears on the bottom of the table. Would appreciae any help in understanding this. Thanks.

Answer

David Barker picture David Barker · Jul 14, 2014

As you're using the old API (<= 1.9.x) you need to make sure that you use the hungarian notation for dom, it's a string so it is sDom.

$('#myTbl').dataTable({   
    "bInfo":true,
    "bJQueryUI": true,
    "bProcessing": true,
    "bPaginate" : true,
    "aLengthMenu": [[50,100,150,200,250,300,-1], [50,100,150,200,250,300,"All"]],
    "iDisplayLength": 50,
    "sPaginationType": "full_numbers",
    "sDom": '<"top"flp>rt<"bottom"i><"clear">'
});