Adding AJAX to will_paginate
Clone this wiki locally
This is the recommended way to add AJAX to will_paginate, and assumes that you have already installed AJAX Pagination. Some steps could be skipped, but would also miss some highly recommended features.
Suppose your view contains:
<!-- /app/views/objects/index.html.erb --> <%= will_paginate @objects %> <% objects.each do |object| %> ... <% end %>
Move that content, including the will_paginate tag to a partial called _page.html.erb. Wrap the will_paginate tag with an ajax_links container. Then wrap the rest of the content using the ajax_loadzone tag. Your partial will contain:
<!-- /app/views/objects/_page.html.erb --> <%= ajax_links :section_id => "page" do %> <%= will_paginate @objects %> <% end %> <%= ajax_loadzone do %> <% objects.each do |object| %> ... <% end %> <% end %>
In your index.html.erb, instead of the content which you moved to the partial, create an ajax_section, referencing the new partial created:
<!-- /app/views/objects/index.html.erb --> <%= ajax_section :id => "page", :render => "page" %>
This also renders the _page.html.erb partial, but the render option is not required, since _page.html.erb will be chosen based on the section id given by the :id option.
Now the ajax_links container will cause the links inside to load new content, via AJAX (instead of a normal full page request), into the ajax_section container, with an id of "page".
Finally in your controller action, add a line calling ajax_respond to your respond_to block as shown:
# /app/controllers/objects_controller.rb Class ObjectsController < ApplicationController def index ... respond_to do |format| format.html # index.html.erb ajax_respond format, :section_id => "page" end end ... end
The ajax_respond call prevents the full webpage being rendered when responding to an AJAX request.
And you are done. Here is an example of it in action: