Default+Input style pagination

Cat

Hi, I'm fairly new to webdevelopment but I've been implementing DataTables into my website for a while now and it's been working great! Much thanks to the impressively helpful support I've gotten here on this forum, now I hate to come ask for more help again but I think I simply lack the javascript coding skills and experience for this one... maybe there's someone out there who knows how to achieve this;

I'm using the default pagination which looks and works great! For example my pagination section can look like this:

Previous 1 ... 45 [46] 47 ... 200 Next

You can go to the next/previous page either by pressing the corresponding buttons or by pressing the number of the page right next to the current page number, and you go to the first and last pages by pressing their corresponding numbers, and at the same time it shows you the total number of pages available by letting you click on the last one :)

So I started wondering if there was any way to go to a specific page when there are a lot of them, best way to do this without ruining the perfection of the default pagination would be to simply make the current page display (here [46]) an input where the user can enter which page they want to go to... so I found this, which includes a brilliant page input which even allows you to use the keyboard arrow keys to switch pages; http://datatables.net/plug-ins/pagination/#listbox

That input box is just what I need, and more! But also it's all I need... however, once the plugin is enabled the pagination looks like this:

First Previous Page [46] of 200 Next Last

With some fiddling I managed to figure out how to remove the first/last buttons, but I can't for the life of me seem to find any way to make it display the page range the way the default pagination does... instead it looks more like the default pagination information display ("Showing page X of Y", which I also already have on my page). Is there any way I can make the plugin input functionality only apply for the box that shows the current page without affecting the rest of the default pagination? What I mean is something like this;

Previous 1 ... 45 [input/display] 47 ... 200 Next

... which is essentially the default pagination, just with an input where it already shows you what page it's currently on. Does anyone know how to achieve this? I tried rebuilding the plugin to just modify the default pagination but I can't quite get it to do what I described without breaking the surrounding functionality... any help would be greatly appreciated, many thanks for your time!

Cat

I found that the default pagination is called "simple_numbers":

• 
  
  • 'simple_numbers` - 'Previous' and 'Next' buttons, plus page numbers

and works like this:

    simple_numbers: function ( page, pages ) {
        return [ 'previous', _numbers(page, pages), 'next' ];
    },

I think that what I'm trying to achieve is replacing the returned "page" part with the input field from the input plugin, or perhaps adding the returned "pages" part to the plugin... does anyone know how to do this or have a lead on what I'm supposed to do?

tangerine

Do you mean this: http://datatables.net/plug-ins/pagination/input ?

Cat

Yeah that's it :) it creates a really cool input field page control which i want to replace the original [current page] display with, but it also replaces the rest of the classic simple_numbers pagination with other stuff, most importantly the part that shows all available pages like a cut range,

like this: 1...5[6]7...12

Ofcourse, the input field is by default far wider than any of the other page numbers, but I figure I can change that with CSS