ASP.NET AJAX 1

ASP.NET AJAX

ASP.NET AJAX 2

Ordinary web applications vs. AJAX

Ordinary web application• The full page is updated at

each request• The page is not available

while being updated

AJAX• A part of the page can be

updated• The page is available while

being updated• Better responsiveness• Flicker-free• More like ordinary Windows

application• Rich Internet Applications

(RIA)

ASP.NET AJAX 3

Some web sites using AJAX

• http://www.dr.dk/Sporten/dongbold/– Results of live sport events– Only parts of the page is

updated

• http://www.google.com/– Auto complete user input

ASP.NET AJAX 4

AJAX general architecture

• AJAX means– Asynchronous JavaScript and

XML

• Server generates– HTML– JavaScript

• Client-side AJAX engine sends– Request to Server side– Response is XML

• From web service

• Figure from www.openajax.org

ASP.NET AJAX 5

ASP.NET AJAX

Figure from http://msdn.microsoft.com/en-us/library/bb398874%28VS.90%29.aspx

ASP.NET AJAX 6

Some ASP.NET server side controls

• ScriptManager– Any ASP.NET page wishing to use AJAX must

include a ScriptManagerControl• UpdatePanel– A panel for partial-page update

• Timer– Makes post back at defined intervals– Used with UpdatePanel to perform periodic

partial-page updates

ASP.NET AJAX 7

ASP.NET AJAX client support

• Browser capability– Generates JavaScript for some browsers• Internet Explorer, Firefox, Apple Safari

• Extends JavaScript– Classes, name spaces, data types, object

serialization, etc.• Network layer– Supports communication with web services

ASP.NET AJAX 8

ASP.NET AJAX examples

• Partial-page update– AJAXORama: DataTimeUpdate.aspx– Example: AjaxLookUpCity

• Timer based partial-page update– AJAXORama: GroupChatAgain.asp

ASP.NET AJAX 9

ASP.NET Web services

• Using AJAX you can call web service methods on the server side.

• Web services normally use HTTP for transportation– The payload is an XML document

ASP.NET AJAX 10

ASP.NET AJAX control kit• Huge collection of controls– Most are JavaScript versions of ASP.NET server controls

• Not included in Microsoft Visual Studio• Download from– http://www.asp.net/ajaxlibrary/act.ashx

• Example components– AutoComplete

• Extends to TextBox• Uses web services to list possible text entries, based on what’s

already in the text box• Example: AJAXORama: autoCompleteFromDatabase.aspx

ASP.NET AJAX 11

References and further readings• George Shepherd ASP.NET Step by Step, Microsoft

Press 2010– Chapter 23 AJAX, page 473-512

• Imar Spaanjaars Beginning ASP.NET 4.0, Wrox 2010– Chapter 10 ASP.NET AJAX, page 331-365

• Bill Evjen Professional ASP.NET 4 in C# and VB, Wrox 2010– Chapter 18 ASP.NET AJAX, page 709-745– Chapter 19 ASP.NET AJAX Control Toolkit, page 747-803

• AJAX: The Official Microsoft ASP.NET Site– http://www.asp.net/ajax