What are some good JavaScript/AJAX interface patterns for websites?

Question

I really like how sites like FogBugz and Facebook offer snappy user interfaces by loading page content asynchronously.

What are some good resources and patterns for applying this to other websites? I am looking for a solution that creates a unique hash URL for each page, preserves history and basic browser functions, and degrades gracefully if JavaScript is not enabled (a great example of this is Facebook).

This blog post is a good start, but it's far from a complete solution/pattern - and any approaches using jQuery would be great.

Answer 1

Here are an example to building Ajax based website using jQuery and PHP

Answer 2

Hi Craig,

IMO, in order to allow a site to degrade gracefully, you should first build at least the framework of the site in the lowest level that you're going to support. In your case, this is going to be standard postbacks.

Once you've got this in place, you can then start adding ajax interactions.

The approach I've taken when using ASP.NET MVC is to have one function which builds the whole page from scratch (for regular postbacks) and then have some extra methods which I used to dynamically refresh content via Ajax. If I want to implement a 'Single Page' method like oyu describe then I would handle the onclick event of a hyperlink and call an ajax method that renders the 'Build Whole Page' method to a string then pump that string into my content div.

HTH

Answer 3

Here is great article about loading content with jQuery, and it degrades gracefuly when js is diasebled. link text