You are on page 1of 22

Creating an ASP.

NET AJAX
Application
Module 11: Creating an ASP.NET AJAX
Application
• Introduction to ASP.NET AJAX

• Creating an ASP.NET AJAX Application by Using the


ASP.NET AJAX Extensions
• Extending an Application by Using the ASP.NET AJAX
Control Toolkit
Lesson: Introduction to ASP.NET AJAX
• What Is Asynchronous JavaScript and XML (AJAX)?

• What Is ASP.NET AJAX?

• Architecture of ASP.NET AJAX


What Is Asynchronous JavaScript and XML
(AJAX)?
AJAX
• Provides techniques for creating interactive Web
applications
• Exchanges data with the Web server in the background

• Enables Web pages to appear more responsive

• Works across platforms and uses open standards


What Is ASP.NET AJAX?
• ASP.NET AJAX is a new Web development technology

ASP.NET AJAX
• Integrates cross-browser script libraries with the ASP.NET
Framework
• Improves efficiency by performing significant parts of a
Web page's processing in the browser
• Provides familiar user interface elements

• Enables partial page updates

• Provides a framework that simplifies customization of


server controls to include client capabilities.
Architecture of ASP.NET AJAX
• Client-script libraries
 Browser compatibility layer
 Core services
 Base class library
 Networking
 Support for JavaScript libraries

• Server components
 Server controls
 Web Services
Lesson: Creating an ASP.NET AJAX Application by
Using the ASP.NET AJAX Extensions
• What Are the ASP.NET AJAX Extensions?

• ASP.NET AJAX Server Controls

• Demonstration: Implementing the UpdatePanel Control

• Managing Partial-Page Updates

• Converting an ASP.NET Application to ASP.NET AJAX


What Are the ASP.NET AJAX Extensions?
• Contains the core server-side components

• Extends ASP.NET 2.0 server-side control framework

• Included with Visual Studio 2008

• Adds controls to the Visual Studio Toolbox


ASP.NET AJAX Server Controls
• ScriptManager
 Manages script resources for client components

• UpdatePanel
 Enables a refresh of part of a Web page

• UpdateProgress
 Provides the status of a partial page update

• Timer
 Performs postbacks at defined intervals
Demonstration: Implementing the UpdatePanel
Control
• Add a ScriptManager control to the Web page

• Add an UpdatePanel control to the Web page

• Add one or more controls to the UpdatePanel

• Set properties of the controls

• Add code to the controls

• Build and run the application


Managing Partial-Page Updates
• PageRequestManager class defines events for customizing
a page’s partial-page rendering
 initializeRequest
 beginRequest
 pageLoading
 pageLoaded
 endRequest
Converting an ASP.NET Application to ASP.NET
AJAX
• Open the existing Web application

• Modify the Web.config file for the application


 configSections
 controls
 compilation
 httpHandlers
 httpModules
 system.web.extensions
 System.webServer

• Add ASP.NET AJAX functionality to the application


Lesson: Extending an Application by Using the
ASP.NET AJAX Control Toolkit
• Overview of the ASP.NET AJAX Control Toolkit

• Accessing the ASP.NET AJAX Control Toolkit

• Implementing Samples and Controls


Overview of the ASP.NET AJAX Control Toolkit
• Joint project between the community and Microsoft

• Built upon the ASP.NET 2.0 AJAX Extensions

• Contains a collection of web-client components

• Provides an infrastructure to write reusable and extensible


ASP.NET AJAX extenders and controls
Accessing the ASP.NET AJAX Control Toolkit
• Download the latest release of the Control Toolkit

• Unpack the Control Toolkit into a folder

• Open or create a Web application

• Add the Control Toolkit items to the Toolbox in Visual


Studio 2008
• Install the AJAX Control Toolkit templates
Demonstration: Implementing Samples and
Controls
• Adding controls from the Control Toolkit to a Web
application
• Adding an AJAX Toolkit extender to a Web application

• Adding animation to a Web application


Creating an ASP.NET AJAX Application
• Exercise 1: Converting the Benefits Application to ASP.NET
AJAX
• Exercise 2: Implementing Partial Page Rendering with the
UpdatePanel Control

Logon information
Virtual machine 2310C_11
User name Student
Password Pa$$w0rd

Estimated time: xx minutes


Lab Scenario
Lab Scenario

Logon Page
Login.aspx
Benefits
Coho Home Page Page Header ASPState
Winery Default.aspx Header.ascx
Menu
Registration Component
Register.aspx Class1.vb or Class1.cs Web.
tempdb
config

Life Insurance Retirement Medical Dental


Life.aspx Retirement.aspx Medical.aspx Dental.aspx

Prospectus Doctors User Control XML Web


Lab Web Prospectus.aspx Doctors.aspx namedate.ascx Service
Application dentalService1.asmx

XML
Doctors Dentists
Files
Lab Review
Module Review and Takeaways
• Review Questions
Review for Alpha
• Is there any topic or specific content item in the module
that seemed unclear or unnecessary?
• Is there any content item/related subject area that was
not covered and could be included?
• Did you observe any issues with the technical accuracy of
the content?
• Is the content in the module presented in a manner that
encourages learning? Did the flow of topics seem right?
• Does the lab outline indicate the expected scope of tasks
to be covered? Would you like to suggest any tasks that
could be removed or added?

You might also like