ajax
TRANSCRIPT
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 )
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