The Microsoft AJAX Library:
Making Client-Side JavaScript
Easier
I
n the first two chapters, you began to get a sense of the power of AJAX and Microsoft’s
implementation: ASP.NET AJAX. In addition, you were shown how asynchronous
JavaScript and XML can make ordinary web applications more interactive and respon-
sive. Chapter 2 provided an overview of ASP.NET 2.0 and, in particular, server controls,
which simplify web development by giving developers the ability to drag and drop rich
controls such as calendars or data grids into web pages. By integrating AJAX with
ASP.NET 2.0 and Visual Studio 2005, Microsoft has greatly simplified the process of
developing, deploying, and debugging AJAX web applications. The second chapter also
introduced the features of the client-side aspect of ASP.NET AJAX: the Microsoft AJAX
Library. This chapter delves more deeply into the AJAX Library, demonstrating the object-
oriented programming paradigm it overlays on JavaScript and then providing some
examples of the different namespaces it offers.
JavaScript with the Microsoft AJAX Library
In the following sections, you’ll learn how to program JavaScript using the Microsoft AJAX
Library by creating your first ASP.NET AJAX-enabled application.
31
CHAPTER 3
828-8 CH03.qxd 9/9/07 5:24 PM Page 31
Downloading and Installing ASP.NET 2.0 AJAX Extension 1.0
To use the Microsoft AJAX Library in your web applications, you must first download the
ASP.NET 2.0 AJAX framework from the ajax.asp.net web site. After clicking on the
Download
link, you can choose either the ASP.NET 2.0 AJAX Extension 1.0 or Microsoft AJAX Library
options. Choose the first option because the Microsoft AJAX Library option contains just
the client JavaScript components that are included in the full ASP.NET AJAX installation.
On the other hand, besides the client JavaScript components, the ASP.NET 2.0 AJAX
Extension 1.0 option also allows developers to use Visual Studio 2005 to create ASP.NET
■
Note
The web sites are created on HTTP because I have IIS installed on my development computer. If you
don't have it, choose File System from the Location drop-down list, and specify a location somewhere on
your hard disk. (It doesn't affect the example whether you use HTTP or the file system.)
Figure 3-2. Default ASP.NET AJAX-enabled web site solution structure
CHAPTER 3
■
THE MICROSOFT AJAX LIBRARY: MAKING CLIENT-SIDE JAVASCRIPT EASIER 33
828-8 CH03.qxd 9/9/07 5:24 PM Page 33
The Microsoft AJAX Library contains three core JavaScript files that deliver client-
side functionality for your web pages. These three JavaScript files are stored as resources
in the
System.Web.Extensions
assembly. At runtime, the HTTP handler
ScriptResourceHan-
dler
loads the files, caches them for future use, compresses them, and sends them to the
web browser when they’re requested. The files contain the following functionality:
• The primary file, named MicrosoftAjax.js, contains 90% of the Microsoft AJAX
Library’s functionality. It includes, among other things, the browser compatibility
layer, the core JavaScript classes, and the Base Class Library.
• The second file, named MicrosoftAjaxTimer.js, contains classes needed to support
the
Timer
server control. This control enables you to update either part of or an
entire web page at regular intervals; for example, you might want to update the
current value of stock prices every 30 seconds. You’ll see how to use the
Timer
con-
Car
. When you use Visual Studio 2005 to create and edit JavaScript code, it provides syn-
tax coloring to make the code easier to understand and maintain. Unfortunately, Visual
Studio 2005 doesn’t add Intellisense; in other words, when you say “Type,” it doesn't
bring up a list of members on the
Type
type.
Figure 3-5 shows the namespace
AJAXBook
and the class definition for
Car
in the editor.
CHAPTER 3
■
THE MICROSOFT AJAX LIBRARY: MAKING CLIENT-SIDE JAVASCRIPT EASIER36
828-8 CH03.qxd 9/9/07 5:24 PM Page 36
Figure 3-5. Implementing your namespace and class in JavaScript
You’ll learn what all this syntax means later in this chapter, but it will make more
sense if we run through the entire example first.
Using the AJAX Script Manager to Deliver Your Custom Class
To implement a web page that uses this class, add a new web form to the solution, and
call it TestAJAXBookNamespace.aspx (see Figure 3-6).
■
Note
The
Default.aspx
page already contains the
ScriptManager
server control, but we’ll use a new
page to show how to add the control to a new page.
■
THE MICROSOFT AJAX LIBRARY: MAKING CLIENT-SIDE JAVASCRIPT EASIER 39
828-8 CH03.qxd 9/9/07 5:24 PM Page 39