AJAX in ASP.NET

James Crowley

Developer Fusion

http://www.developerfusion.co.uk/

Overview

What is AJAX? How does it work? Using it in ASP.NET 1.x Using it in ASP.NET 2.0 Challenges

What is AJAX (and who cares?)

Current postback solutions can be slow and confusing to users

AJAX allows server-side processing to occur without a postback, and therefore...

a more interactive & responsive UI Nothing new, but all the rage thanks to

Google Maps, Flickr, and A9 to name a few

How it works

ServerServer

Web ServerWeb Server

DatabaseDatabase

Client BrowserClient Browser

JavaScriptJavaScript

DHTMLDHTML

XML HTTP Object

XML HTTP Object

1

Async HTTP Request

Parameters

How it works

ServerServer

Web ServerWeb Server

DatabaseDatabase

Client BrowserClient Browser

JavaScriptJavaScript

DHTMLDHTML

XML HTTP Object

XML HTTP Object

2

How it works

ServerServer

Web ServerWeb Server

DatabaseDatabase

Client BrowserClient Browser

JavaScriptJavaScript

DHTMLDHTML

XML HTTP Object

XML HTTP Object

3

Async HTTP Response

Text, XML, HTML, etc

AJAX in ASP.NET 1.x

Either we deal with the XML HTTP request ourselves

or we can use an existing library, such asAJAX.NET wrapper

http://ajax.schwarz-interactive.de/ “My AJAX.NET” http://

jason.diamond.name/weblog/

Demo

“Colourizing” Code

Complex Data Types

Need to either reproduce (a subset of) the .NET type system within JavaScript or vice-versa

Need to serialize for transfer via HTTP Serializable return types dealt with

automatically Parameters are harder

Demo

“Google Suggest”

AJAX in ASP.NET 2.0

Known as “Script Callbacks” Call ClientScript.GetCallBackEventReference to

get the string for a javascript call to trigger a callback

Implement the ICallbackEventHandler interfacepublic interface ICallbackEventHandler { void RaiseCallbackEvent(string eventArgument); String GetCallbackResult(); }

public string GetCallbackEventReference(System.Web.UI.Control control, string argument, string clientCallback, string context, string clientErrorCallback, bool useAsync)

ASP.NET 2.0 vs AJAX.NET No dynamic mapping of parameters using

reflection More complicated with multiple callbacks No JavaScript objects corresponding to

server-side types (only returning strings) Executes within the page lifecycle

Things to note

ViewState not updated during a callback because of allowance for parallel callbacks

Page.IsPostBack is true for callbacks and postbacks. Use Page.IsCallback

Request.Browser.SupportsCallback

Demo

AJAX in ASP.NET 2.0

Atlas

New library from Microsoft to plug-in to ASP.NET 2.0

Preview available from http://atlas.asp.net/ Warning: pre-Alpha quality! But Microsoft wants your feedback…

Atlas

Cross-browser script libraries, bringing namespaces, inheritance, and plenty more

Callbacks triggered in similar way to AJAX.NET library

Web Services integration Declarative data binding New AJAX-enabled server controls

Things to watch out for…

Debugging is a pain Response timeouts and server exceptions Non-JavaScript/non-ActiveX scenarios

Things to watch out for…

Accessibility, page flow, scroll position Can break layered architectures Inability to access by URL, and breaking

back/forward browser buttons No search indexing for AJAX’ed data

Wrapping Up

Go away and experiment! Email me: james@developerfusion.co.uk

AJAX enables you to create web apps that are…

more responsivewith enhanced functionality

… and a great user experience

References

ASP.NET AJAX Libraries http://ajax.schwarz-interactive.de/ (AJAX.NET)

Tutorial @ http://www.developerfusion.co.uk/show/4704/

http://jason.diamond.name/weblog/ (My AJAX.NET) http://atlas.asp.net/ (Atlas)

My Contact Details Web: http://www.developerfusion.co.uk/ Email: james@developerfusion.co.uk