Professional ASP.NET 3.5 in C# and Visual Basic Part 98 pot

This chapter took a look at the core foundation of ASP.NET AJAX that is available with the default install of Visual Studio 2008.. With the install of the .NET Framework 3.5 and through

Trang 1

Evjen c19.tex V2 - 01/28/2008 3:08pm Page 928

Chapter 19: ASP.NET AJAX

<asp:Button ID="Button1" runat="server"

Text="Click to initiate async request"

OnClick="Button1_Click" />

</div>

</form>

</body>

</html>

C#

<%@ Page Language="C#" %>

<script runat="server">

protected void Button1_Click(object sender, EventArgs e)

{

Label1.Text = "Label1 was populated on " + DateTime.Now;

Label2.Text = "Label2 was populated on " + DateTime.Now;

}

</script>

Now that both of the UpdatePanel controls are set to have anUpdateModeofConditional, when running

this page, you will see the results presented in Figure 19-15

Figure 19-15

In this case, only the right Label control,Label1, was updated with the asynchronous request even

though theButton1_Click()event tries to change the values of bothLabel1andLabel2 The reason for

this is that the UpdatePanel2 control had no trigger that was met

Summar y

ASP.NET AJAX, although it is in its infancy, is an outstanding technology and will fundamentally change

the way Web application development is approached No longer do you need to completely tear down

a page and rebuild it for each and every request Instead, you are able to rebuild the pages slowly in

sections as the end user requests them The line between the thin-client world and the thick-client world

just got a lot more opaque

This chapter took a look at the core foundation of ASP.NET AJAX that is available with the default install

of Visual Studio 2008 Beyond that, there is much more A big addition is the ASP.NET AJAX Control

Toolkit, the focus of the next chapter

928

Trang 2

ASP.NET AJAX Control

Toolkit

ASP.NET AJAX applications were introduced in the previous chapter With the install of the NET

Framework 3.5 and through using Visual Studio 2008, you will find a few controls available that

allow you to build ASP.NET applications with AJAX capabilities This is the framework to take your

applications to the next level because there is so much that can be accomplished with it, including

adding specific AJAX capabilities to your user and custom server controls Every AJAX

enhance-ment added to your application will make your application seem more fluid and responsive to the

end user

You might be wondering where the big new AJAX-enabled server controls are for this edition of

Visual Studio 2008 if this is indeed a new world for building controls The reason you do not see a

new section of AJAX server controls is that Microsoft’s has treated them as an open-source project

instead of just blending them into Visual Studio 2008

Developers at Microsoft and in the community have been working on a series of AJAX-capable

server controls that you can use in your ASP.NET applications These controls are collectively called

the ASP.NET AJAX Control Toolkit You will find a link to the control toolkit for download at

www.asp.net/AJAX When you choose to download the control toolkit from this page, you will be

directed to the ASP.NET AJAX Control Toolkit’s page on CodePlex atwww.codeplex.com/Release/

ProjectReleases.aspx?ProjectName=AtlasControlToolkit This page is shown in Figure 20-1

Downloading and Installing

Since the ASP.NET AJAX Control Toolkit is not part of the default install of Visual Studio 2008, you

have to set up the controls yourself Again, the control toolkit’s site on CodePlex offers a couple of

options to you

First off, you are able to download a control toolkit that is specifically targeted at Visual Studio 2008

or Visual Studio 2005 This chapter focuses on using the control toolkit with Visual Studio 2008

Trang 3

Chapter 20: ASP.NET AJAX Control Toolkit

The CodePlex page for this project offers two ways to get what you are after The ASP.NET AJAX

Control Toolkit can be downloaded as source code or as a compiled DLL

Figure 20-1

The source control option allows you to take the code for the controls and ASP.NET AJAX extenders

and change the behavior of the controls or extenders yourself The DLL option is a single Visual Studio

installer file and a sample application

There are a couple of parts to the install One part provides a series of new controls that were built with

AJAX capabilities in mind Another part is a series of control extenders (extensions upon pre-existing

controls) You will also find some new template additions for your Visual Studio 2008 instance

To get set up, download the.zipfile from the CodePlex site and unzip it where you want on your

machine The following sections show you how to work with the various parts provided from the Control

Toolkit

930

Trang 4

New Visual Studio Templates

Included in the download is a.vsifile (Visual Studio Installer) calledAJAXControlExtender.vsi This installer will install four new Visual Studio projects for your future use The installer options are shown

in Figure 20-2

Figure 20-2

After installing these options, you have access to the new project types this provides as illustrated in

Figure 20-3

Trang 5

Figure 20-3

Adding the New Controls to the VS2008 Toolbox

In addition to new project types, you can also add the new controls to your Visual Studio 2008 Toolbox

To accomplish this task, right-click in the Toolbox and select Add Tab from the provided menu Name

the tab as you wish, though, for this example the tab was named AJAX Controls

With the new tab in your Toolbox, right-click the tab and select Choose Items from the provided menu

This action is illustrated in Figure 20-4

Select Choose Items from the menu to open the Choose Toolbox Items dialog From here, you want to

selectAjaxControlToolkit.dllfrom the sample application’s Bin folder Remember that the

SampleWebSite is a component that was downloaded and unzipped as part of the Control Toolkit When

you find the DLL and click Open The Choose Toolbox Items dialog changes to include the controls that

are contained within this DLL The controls are highlighted in the dialog and are already selected for you

(as shown in Figure 20-5)

From here, click OK and the ASP.NET AJAX Control Toolkit’s new controls will be added to your Visual

Studio Toolbox The end result is presented in Figure 20-6

You will find that there are more than 35 new controls and extenders added to the Toolbox for you to

utilize in your ASP.NET applications

932

Trang 6

Figure 20-4

Figure 20-5

Trang 7

Figure 20-6

The ASP.NET AJAX Controls

The number of controls and extenders available from the Control Toolkit is large As stated, there are

more than 35 controls and extenders at your disposal This section will look at these new items and how

you can use them in your ASP.NET applications

When you add an ASP.NET AJAX server control to your page, one thing you will notice is that a number

of DLLs focused on localization into a number of languages have been added to the Bin folder of your

934

Trang 8

solution All the resource files have been organized into language folders within the folder An example

of what you will find is presented in Figure 20-7

Figure 20-7

Looking at one of the DLLs with Lutz Roeder’s NET Reflector tool (www.aisto.com/roeder/dotnet/), you will notice that they are focused on the client-side localization required by many applications As an example, theAjaxControlToolkit.resources.dllfor the Russian language within Reflector is shown

in Figure 20-8

In addition to the localization DLLs added to your project, the ASP.NET AJAX control is added just as

any other custom server control in ASP.NET Listing 20-1 shows what your ASP.NET page looks like

after the addition of a single ASP.NET AJAX control to it

Listing 20-1: Changes to the ASP.NET page after adding an ASP.NET AJAX control

<%@ Page Language="C#" AutoEventWireup="true"

CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit"

Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Continued

Trang 9

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title>Untitled Page</title>

</head>

<body>

<form id="form1" runat="server">

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<cc1:AlwaysVisibleControlExtender

ID="AlwaysVisibleControlExtender1" runat="server"

TargetControlID="TextBox1">

</cc1:AlwaysVisibleControlExtender>

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

</div>

</form>

</body>

</html>

Figure 20-8

In this example, you can see that the ASP.NET AJAX control is registered on the page using the

@Registerdirective This directive points to theAJAXControlToolkitassembly and gives all controls

that use this assembly reference a tag prefix ofcc1, which is why you see the

AlwaysVisibleControl-Extender control prefixed with a<cc1:[control name]>

936

Trang 10

ASP.NET AJAX Control Toolkit Extenders

The first set of items you look at includes the new extenders that are part of the ASP.NET AJAX Control Toolkit Extenders are basically controls that reach out and extend other controls For an example of

this, you can think of the ASP.NET Validation Controls (covered in Chapter 4 of this book) as extender controls themselves For instance, you can add aRequiredFieldValidatorserver control to a page and associate it to a TextBox control This extends the TextBox control and changes its behavior Normally it would just accept text Now, if nothing is entered into the control, then the control will trigger an event back to the RequiredFieldValidator control whose client-side behavior is controlled by JavaScript

The ASP.NET AJAX Control Toolkit’s extenders pretty much accomplish the same thing The controls

extend the behavior of the ASP.NET server controls with additional JavaScript on the client as well as

some server-side communications

The ASP.NET AJAX extender controls are built using the ASP.NET AJAX extensions framework The

next few pages focus on using these new extenders within your ASP.NET applications

AlwaysVisibleControlExtender

The AlwaysVisibleControlExtender allows you to specify controls that will always be present on a long page that requires scrolling With this control, you can specify a location of the page where the

con-trol will always be present, no matter how the end user scrolls the page Your options are to assign

the vertical or horizontal alignment of the control that will always be visible An example of using the

AlwaysVisibleControlExtender is presented in Listing 20-2

Listing 20-2: Using the AlwaysVisibleControlExtender

VB

<%@ Page Language="VB" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit"

TagPrefix="cc1" %>