Recently, at work,  i had to include the jPaginator as default paginator for the jQuery Datatable .

The way to add a custom paginator to the Datatable is really clean: you can write your own paginator as stand alone module and integrate it with the grid, as plugin, by extending the object $.fn.dataTableExt.oPagination (documentation here).

My goal was to get two paginators on the screen, one on the top (as jPaginator) and one on the bottom (the default one) of the grid. The jPaginator on the top is an interesting solution: if the user wants to jump over many pages, the jPaginator will perfectly fit that. When the user goes to the end of the page, the searched item is probably supposed to be on the same page or in a close one.

The full screen demo here: http://jsfiddle.net/lzzluca/duREA/embedded/result/

The code behind the demo: http://jsfiddle.net/lzzluca/duREA/

Sources: https://github.com/lzzluca/jPaginator4Datatable_bis

Foot note

Looking for an already written plugin, i have found this one: jPaginator plugin for Datatable . It works good but it didn’t match my goal, because it is designed to show the jPaginator only.

Some links

• Datatable forum ‘Paginator like jPaginator’
• http://datatables.net/
• http://datatables.net/development/pagination
• http://remylab.github.com/jpaginator/

Thanks for reading