Implementing AJAX based pagination

The previous recipe, Paginating a custom find type, showed us how to paginate a custom find type. Each page link changes the browser location, forcing the reload of all the elements in the page.

This recipe allows us to use AJAX (using the jQuery javascript library) to only load what is really needed, so that every time a page is changed, only the set of rows is changed without having to load a whole new page.

Getting ready

We need some sample models and data to work with, and we need a fully working pagination of a custom find type. Follow the entire recipe, Paginating a custom find type, including its Getting ready section.

How to do it...

1. 1. We start by adding the jQuery javascript library to our layout. If you don't have one already, create a file named default.ctp in your app/views/layouts directory. Make sure you add the link to the jQuery library (here we are using the Google-hosted one), the place holder for a loading message (to be shown when an AJAX...