Friday, February 09, 2007

ajax back button support

One of the keys to AJAX's popularity on the web is that it radically improves the usability of many websites. When viewing online maps, we no longer have to click "Up Arrows" and "Down Arrows" to get the page to refresh with a new view of the map. Instead, we can intuitively grab the map and move it in the direction that we want, instantly (with no page refresh) seeing our new map view. While this web browsing nirvana has arguably changed the face of the Web, it has also destroyed the usability of the most used browser function: the back button.

Users (power and average alike) have an insatiable desire to use the back button to get back to somewhere they just were or to undo something they've just done. All the joy they experience using your application quickly fades when they discover their back button no longer works. As AJAX developers, we must acknowledge this user dependence on the back button and make sure it works as users expect it to.

That means we need to populate the browser's history with a URL that can reload an application's state every time an AJAX operation has caused a significant change in the state of the application (such as expanding a grid hierarchy or changing a tab view). Nickhil Kothari, an architect on the Web Platform and Tools team at Microsoft, has posted an updated UpdateHistory control that runs on the ASP.NET AJAX 1.0 framework that enables you to solve this problem. Using his control, you can selectively populate the browser's history to represent different logical views of your AJAX enabled page. That allows you to present rich AJAX interfaces without breaking your user's back button. (Off topic: Nickhil has also got a neat animated UpdatePanel on the same page that's worth checking out.)

Telerik has not yet added out-of-the-box back button support to r.a.d.ajax, but hopefully examples like this will help shape the way that support can be added. Until then, check out Nickhil's control and start improving your AJAX applications.


marker said...

You should totally check out the article which goes over how to fix the ajax back button.

It is important for site usability etc.