Sign in through GitHub
Pagination with AJAX

#174 Pagination with AJAX

Aug 10, 2009 | 13 minutes | Ajax, Views
Learn an easy, unobtrusive way to add AJAX functionality to an existing set of pagination links using jQuery.
Click to Play Video ▶
  • Download:
  • source codeProject Files in Zip (115 KB)
  • mp4Full Size H.264 Video (19.3 MB)
  • m4vSmaller H.264 Video (13.3 MB)
  • webmFull Size VP8 Video (33.3 MB)
  • ogvFull Size Theora Video (25.9 MB)
Browse_code Browse Source Code

Resources

config/environment.rb 
config.gem "mislav-will_paginate", :lib => "will_paginate", :source => "http://gems.github.com"
products_controller.rb 
def index
  @products = Product.paginate(:per_page => 10, :page => params[:page])
end
layouts/application.html.erb 
<%= javascript_include_tag 'jquery' %>
products/index.js.erb 
$("#products").html("<%= escape_javascript(render("products")) %>");
public/javascripts/pagination.js 
$(function() {
  $(".pagination a").live("click", function() {
    $(".pagination").html("Page is loading...");
    $.getScript(this.href);
    return false;
  });
});

// For older jQuery versions...
// jQuery.ajaxSetup({ 
//   'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")}
// });