Learn AJAX at

AMC Square Learning

What is AJAX ?

• "Asynchronous JavaScript and XML"•New name for an old technique:• JavaScript + DHTML + XMLHttpRequest• In use since at least 1997• I've used it since 2000• Finally someone gave it a name• Already enabled in your Web server and browser

•Use JavaScript asynchronously behind the scenes to load additional data (typically XML) without discarding and reloading the entire Web page.

Why to use AJAX ?

Used for developing fast and dynamic websiteHelps to process performing data in the client side

(JavaScript) with data taken from the server.Selectively modify a part of the page displayed by

the browser without resubmitting.

Elements of AJAX

HTML and CSS JavaScriptThe XMLHttpRequest class

Working of AJAX :Use a programming model with display and eventsUse XMLHttpRequest to get data on the server using two

methods :open() and send()Open() : for creating connectionSend() : for sending request to the serverData processed by the server will be found in the

attributes of XMLHttpRequest object.responseXML : for an XML fileresponseText : for plain textreadyState attribute of XMLHttpRequest is used for finding

the availability of data5 states– 0:not initialized, 1:connection established,

2:request received, 3: ans in progress , 4: finished

Implementing AJAX

•To implement AJAX we need to answer three questions:•What triggers the AJAX request?• Usually a JavaScript event (onblur, onclick, etc.)

•What is the server process that handles the AJAX request and issues the response?• Some kind of URL (use a Service Locator)

•What processes the response from the server(what is the callback method)?• A JavaScript function that gets the response and manipulates the

DOM, based on the text returned.

Security Issues

•Can only hit domain the Web page came from• Cannot access a 3rd party Web Service• However:• You can wrap those requests through your own server• User can allow access to specific sites via browser security settings• IFRAME can access any site (instead of XMLHttpRequest)

Drawbacks of AJAX

Ajax wont work if JavaScript is not activatedBack button may be deactivatedSince data to display are displaying dynamically ,they are not

part of the page. (keywords inside are not used by search engine)

Thank you