Ajax

Rajesh Kumar

11B81A0558

AJAX stands for Asynchronous JavaScript

and XML.

AJAX is a new technique for creating better,

faster, and more interactive web applications

with the help of XML, HTML, CSS, and Java

Script.

Allows web pages or parts of them to be

updated asynchronously .

Internet Explorer introduces the concept of IFrame element in 1996.

In the year 1998, Microsoft introduces another technique, called ‘Microsoft’s

Remote Scripting’ as a replacement to the older techniques.

A year later, in 1999, Microsoft introduces the XMLHttpRequest object, an

ActiveX control, in IE 5.

The term AJAX is coined on February 18, 2005, by Jesse James Garret in

a short essay published a few days after Google released its Maps

application.

Finally, in the year 2006, the W3C announces the release of the first draft

which includes the specification for the object (XHR) and makes it an official

web standard.

• HTML & CSS - for presenting.

• JavaScript - for local processing.

• Document Object Model (DOM) – to access data

inside the page or to access elements of an XML file

on the server.

• XMLHttpRequest object – to read/send data to the

server asynchronously.

AJAX enables a much better user experience

for Web sites and applications.

Portable across browsers

reduce software maintenance costs and

increase its reach. You can use AJAX to load

specific portions of a page that need to be

changed.

It further reduces network traffic.

Google Maps, A user can drag an entire map by

using the mouse.

Google Suggest, As you type, Google offers

suggestions. Use the arrow keys to navigate the

results.

Gmail Gmail is a webmail built on the idea that

emails can be more intuitive, efficient, and

useful.

Facebook,Orkut.

All the available browsers cannot support AJAX.

Here is a list of major browsers that support

AJAX.

Mozilla Firefox 1.0 and above.

Netscape version 7.1 and above.

Apple Safari 1.2 and above.

Microsoft Internet Explorer 5 and above.

Opera 7.6 and above.

1. A client event occurs2. An XMLHttpRequest object is

created3. The XMLHttpRequest object is

configured4. The XMLHttpRequest object

makes an async. Request5. The ValidateServlet returns an

XML document containing the result

6. The XMLHttpRequest object calls the callback() function and processes the result

7. The HTML DOM is updated

<script type="text/javascript">

function ajaxFunction()

{

var xmlHttp;

try

{

// Firefox, Opera 8.0+, Safari

xmlHttp=new XMLHttpRequest();

}

catch (e)

{

// Internet Explorer

try

{

xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

}

catch (e)

{

try

{

xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

}

catch (e)

{

alert("Your browser does not support AJAX!");

return false;

}

}

}

}

</script>

Script creates variable

Warning for user if all

browsers fail

IE can use 2 types

of ActiveXObjects

The XMLHttpRequest object is the key to AJAX.

It has been available ever since Internet Explorer

5.5 was released in July 2000, but was not fully

discovered until AJAX and Web 2.0 in 2005

became popular.

XMLHttpRequest (XHR) is an API that can be

used by JavaScript, web browser scripting

languages to transfer and manipulate XML data

to and from a webserver using HTTP,

establishing an independent connection channel

between a webpage's Client-Side and Server-

Side

abort()

getAllResponseHeaders()

getResponseHeader( headerName )

open( method, URL )

open( method, URL, async )

open( method, URL, async, userName )

open( method, URL, async, userName,

password )

send( content )

setRequestHeader( label, value )

Onreadystatechange

readyState

responseXML

Status

statusText

Cross-Browser and Cross-Platform Compatibility.

Ajax application can be build with open standards technologies, is not tied to proprietary software.

Lower cost of development. The code can be optimized and separated. More rich interaction with the user, by

example:autocomplete, drag and drop, transparency, shading, Z-ordering, etc.

More speed, and less wait time for screen updated. Widespread adoption of Ajax by industry leaders. Integration with others proprietaries technologies.

Same security problems as in classic Web applications.

Think of different way in the development and design.

The use of frameworks can generate complexity.

More interaction through JavaScript.More code for old browser.Special code for some functions of Internet

Explorer.

Server Side

AJAX-based Web applications use the same

server side securityschemes of regular Web

applications.

Client Side

Downloaded JavaScript code is constrained by

sand-box security model and can be relaxed for

signed JavaScript.

AJAX extends the usefulness of web apps

Saves entire pages reloading

Gives greater transparency to users

Data loads ‘in the background’

Uses existing technologies

Is becoming very popular

1. http://www.w3schools.com/ajax/

2. http://www.tutorialspoint.com/ajax/

3. http://net.tutsplus.com/

4. https://developer.mozilla.org/en/XMLHttpReque

st

5. SAMS Teach Yourself Ajax in 10 Minutes, Phil

Ballard, p. 85

6. JavaScript & AJAX, 6th Edition, Tom Negrino

and Dori Smith, ch.15

Thank You!