Over the last year or so, AJAX has taken the web development world by storm. AJAX is short for Asynchronous JavaScript and XML and is an approach to building dynamic web applications that behave less like the static web pages we are used to and more like desktop applications.

At the heart of AJAX is the XmlHttpRequest object, a component originally designed by Microsoft and used to provide the rich Outlook-like interface of Exchange Web Access. JavaScript on a web page can use an instance of XmlHttpRequest to send requests to the web server that generated the page and then use the response to update part of the page, without the browser having to reload everything. This can make the application a lot quicker; instead of the entire page having to be transmitted and rendered, the browser just fetches what is needed to update the current page.

Although the technologies that support AJAX-style web apps have been around for years, they were not widely used until the introduction of frameworks that made dealing with the extra complexity, not to mention cross-browser differences, possible. Microsoft’s ASP.NET AJAX Framework is one of the most recent, and has just been released as version 1.0, following a year of pre-releases that used the code name “Atlas.”

This article shows you how to AJAX-enable an existing ASP.NET web page by using Microsoft’s ASP.NET AJAX Extensions. The UpdatePanel control provided by the framework makes it really easy to start with AJAX programming by defining the areas of the page you want to update independently without a full page reload.

Once you have understood the basics, you will use an InnerWorkings coding challenge that provides a sample AJAX-enabled bug tracking website to help you really understand how to use the AJAX Extensions.

Figure 1