Pagination -- Paging through results with page-down/page-up keys, and mousewheel scrolling?

oswiki

Hi! I've browsed through this forum, and see that some people have inquired about "endless scrolling," that is, having a DataTable load more & more results as the user scrolls downward. I understand that this isn't supported just yet.

I was wondering about something slightly different, and hopefully much simpler. Is it possible to configure DataTables such that the conventional pagination (clicking from one page of the table to the next) can be triggered via the page-up and page-down keys? And could this same functionality also be extended to scrolling with a mousewheel?

Thanks!

allan

Yup - this is absolutely possible. Slightly tricky when you consider multiple tables on a single page, but readily doable without that. You just need to attach the required events (mousewheel for example) to the fnPageChange (http://datatables.net/api#fnPageChange ) API function.

Further to that, here is a pagination plug-in which allows key entry (including up and down keys): http://datatables.net/plug-ins/pagination#text_input

Regards,
Allan

Ronald

Hi,
Four days i try to change page with mousewheel and i'm not a pro.
Since february 2010, is there anyone who write the code and want to share it ?
(sorry poor english).
Thanks!

allan

Not as far as I am aware. However, there is a demo of using the mouse wheel event in jQuery here: http://brandonaaron.net/code/mousewheel/demos . That could then be bound to the DataTables fnPageChange API method to change the page as needed.

An alternative would just be to use scrolling: http://datatables.net/release-datatables/examples/basic_init/scroll_y.html

Allan

Ronald

Thanks for your response, it was simple all things considered.
i had already the jquery.mousewheel.js in my site, i just had this code in my script :

$('#dataTable tbody')
.bind('mousewheel', function(event, delta) {
var dir = delta > 0 ? 'previous' : 'next';
oTable.fnPageChange(dir);
return false;
});

camainc

Thanks, Ronald. Your code works great.