Screencast: Ajax Historie anpassen

Download:

Download(19.9 MB, 10:35) Alternativer Download für iPod & Apple TV(18.9 MB, 10:35)

Resourcen:

• Episode 240: Search, Sort, Paginate with AJAX
• Episode 175: AJAX History and Bookmarks
• GitHub Blog Post
• Mozilla History Documentation
• Full episode source code

Quellcode:

[javascript] /* application.js */ if (history && history.pushState) { $(function() { $(“#products th a, #products .pagination a”).live(“click”, function() { $.getScript(this.href); history.pushState(null, document.title, this.href); return false; }); $(“#products_search input”).keyup(function() { $.get($(“#products_search”).attr(“action”), $(“#products_search”).serialize(), null, “script”); history.replaceState(null, document.title, $(“#products_search”).attr(“action”) + ”?” + $(“#products_search”).serialize()); return false; }); $(window).bind(“popstate”, function() { $.getScript(location.href); }); }); }

/* products/index.js.erb */ $(“#products”).html(”<%= escape_javascript(render(“products”)) %>”); document.title = ”<%= escape_javascript(”#{params[:search].to_s.titleize} Products by #{(params[:sort] || ‘name’).titleize} - Page #{params[:page] || 1}”) %>”; [/javascript]