AJAX Internals

You can find wrapper class built for AJAX object and effectively used in the following url.

http://www.ajaxtoolbox.com/

Correlate that, AJAX can be studied regardless wherever it is applied.

AJAX stands for Asynchronous Javascript for XML. AJAX provisions another way of making web request (HTTP Get/Post) to the web server (HTTP Server). It is basically a client side object. As part of normal/event javascript calls, we can make this AJAX calls to web server; the advantage we get is the page won't get refreshed unless we render some content thru' client side scripts. Some AJAX frameworks, for example in Atlas.net, the AJAX calls been tided with the server side(.net) event routines, so rendering will look like, been done from server end, but it actually not because always rendering done thru' client side script. AJAX object serves the ready state about the response, so we can say loading till we get the content from the web server. This is general idea about AJAX.

To dive little deeper....

we can create the AJAX object using the following piece of javascript code. This object creation is browser dependent.

To make the web request (GET/POST) the following function can be used. Content from server can be get from the property 'responseText'. It can be normal Text or XML or JSON text. JSON stands for Javascript Object Notation. It is the way to represent Javascript Object in a single string (refer http://json.org/).

xmlHttp.open('GET'/*GET or POST*/
,'http://intranet.hcleai.com/getacllist.jsp'/*url*/
,true/*asynchronous or synchronous*/
,'jacob'/*Username*/
,'secretpass'/*password*/
)

If the method is GET is used, then querystring has to be sent using send function or else should be placed along with url as part of open function.

xmlHttp.send(<>)
/*for examle*/xmlHttp.send('?firstname=jacob&password=teetee')

If the method is POST is been used, then before calling the open function, the request header should be set to be form-urlencoded..

xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');

Result of the web request can retrieved using the following property

var ouput=xmlHttp.responseText;

The status of the web request made can be monitored by the following event call.

xmlHttp.onreadystatechange=function()
{
.....
.....
}

The status of the web request made can be found by the following property

if(xmlHttp.readyState==0) //The request is not initialized
if(xmlHttp.readyState==1) //The request has been set up
if(xmlHttp.readyState==2) //The request has been sent
if(xmlHttp.readyState==3) //The request is in process
if(xmlHttp.readyState==4) //The request is complete

--
Anand
anand.sadasivam@googlemail.com