Adding AJAX to site navigation

This is the recommended way to add AJAX to site navigation, and assumes that you have already installed AJAX Pagination. Some steps could be skipped, but would also miss some highly recommended features.

We need to let AJAX Pagination know what part of the page should be reloaded when the site is navigated. We can do this in your application layout. By wrapping the ```erb <% yield %>

```erb
<%= ajax_pagination :pagination => "", :reload => {:urlpart => "path", :urlregex => "^.*$"}, :loadzone => true do %>
  <%= yield %>
<% end %>

This simply names the section "" (it is recommended to name site-wide navigation with the empty string), and says that the content needs to be reloaded if the path in the url changes (for back and forward buttons).

Now, we need to get the links to call AJAX Pagination when clicked. To do that, simply wrap your menu links with a container, with class="ajaxpagination", and data-pagination="". Normally your menu for site-wide navigation is in the same layout file.

<div class="ajaxpagination" data-pagination="">
  <ul>
    <li><%= link_to "Home", root_url %></li>
    <li><%= link_to "Posts", posts_url %></li>
    <li><%= link_to "Changelog", changelog_url %></li>
    <li><%= link_to "Readme", pages_readme_url %></li>
    <li><%= link_to "About", pages_about_url %></li>
  </ul>
</div>

The class activates AJAX Pagination, and the data-pagination attribute tells AJAX Pagination to put the new content inside the section named "".

Finally, it is highly recommended to get AJAX Pagination to detect and respond to the AJAX call (at the moment it simply retrieves the whole page, and selects the specific content required).

You can do this in the ApplicationController, by calling ajax_pagination (normally we would specify the pagination name, but for this method, the default is :pagination => "":

class ApplicationController < ActionController::Base
  ajax_pagination

  ...
end

This just modifies the default_render behaviour when the request is an AJAX call, to only return the view template, without the layout.

It should now work properly, below is a site with this implemented:

What about other links?

Use the ajax_link_to helper.