Copyright © 2006 O'Reilly Media, Inc.
December 3, 2007
Abstract
UpdatePanel is one of the most useful controls provided with ASP.NET Ajax, the new Microsoft framework that brings the power of AJAX to ASP.NET 2.0 applications. You'll learn from the experts—Bertrand Le Roy and Matt Gibbs, members of the Microsoft ASP.NET Ajax architecture and development team—what you need to know to make UpdatePanel part of your application pages. You'll also learn how to use the control to improve the performance of an ASP.NET Wizard control; create a better master/details page for the AdventureWorks database; and add a pop-up preview to a search page. Finally, you'll learn how to display UpdatePanel error messages and deal with its quirks and limitations. In short, this PDF has exactly what you need to begin adding the interactivity of AJAX to your ASP.NET 2.0 applications today.
One of the ways that Ajax (Asynchronous JavaScript and XML) web applications differ from classical web applications is in how they communicate with the server. AJAX applications use client script to update parts of a page instead of postbacks, which refresh the entire page. This technique results in more fluid and responsive applications with much greater appeal to the user.
The ASP.NET AJAX UpdatePanel
control greatly simplifies the work of adding this functionality to your
ASP.NET 2.0 applications. This PDF begins with a quick tutorial on the
control itself (see "Introducing the Update Panel Control"). Later, you'll
see how it can improve the interactivity of an ASP.NET Wizard control, a master/details page for the
AdventureWorks database, and a search page with a details preview for the
same database. Finally, you'll learn how to display errors associated with
UpdatePanel updates and how to deal
with a number of its peculiarities.
Some History: From XmlHttp to UpdatePanel
There are many communication channels that client script can use
to communicate with a web page server, but the one most commonly used is
XmlHttp. XmlHttp was introduced in Internet Explorer 5
in 1998 after it was implemented by the Microsoft Exchange team in the
creation one of the earliest AJAX applications, Outlook Web Access,
which is the web-based client for Exchange. And before that, Active
Server Pages (the ancestor of ASP.NET) used a Java applet to implement
what was at the time called remote scripting.
ASP.NET 1.0 did not support a remote-scripting mechanism out of the box,
but when ASP.NET 2.0 shipped in 2005, it introduced
callbacks, a way for server controls on web pages
to communicate out of band (i.e., between postbacks) with the server.
The callbacks API is very simple in that it allows client script to send
a string parameter to a control and for that control to send back a
string response. The server-side model is event-based and
stateful, which means that during a callback you
have access to the state of all controls on the page, much like during a
postback.
During the beta period for ASP.NET 2.0, we received feedback from our early adopters who told us that the communication model would be much improved by allowing the transfer of more complex parameters than strings, and that page developers (as opposed to control developers) were having a hard time using the feature.
To try to alleviate this concern, Bertrand Le Roy (with the help
of Sam Spencer, also of Microsoft) released the source code for a
communication library that was built on top of callbacks and simplified
their use, especially for page developers. The library featured a richer
serialization API to enable the exchange of arbitrary types between the
browser and server, but the feature that was most successful was a
control called RefreshPanel, the
ancestor of the UpdatePanel
control.
As we designed and developed ASP.NET Ajax, the RefreshPanel approach appears to be an ideal
way to implement AJAX functionality in existing ASP.NET server
applications while minimizing the changes necessary to do so. UpdatePanel significantly improves on RefreshPanel by integrating more deeply with
the page lifecycle and by being a lot more transparent.