Ajax Training, Learn Ajax Video Tutorials Online, Ajax Examples

The actual AJAX stands for Asynchronous Javascript and XML. Asynchronous means that you can interact with the server in asynchronous manner. Which means you don’t have to pause the browser, the browser don’t have to wait for the data have to return before preceding what happens is browser ask for data and data sent back to the browser, and when browser notified, continue in the meantime waiting for data continue processing and performing actions for the user. But when the data downloaded browser notified and the data is used by javascript inside the browser. That’s the javascript part of Ajax is javascript and make everything work in browser allows you to connect the server.

So Asynchronous Javascript and XML, now there’s actually two ways working with data from the browser either plain text or XML. We’re going to work with plain text originally, because it’s easier to work with text and Javascript than XML. But you can also work with XML, XML plays crucial role on the web for data handling. It is the preferred technique for passing data backend and forth on the internet because XML data is in pure text form, and Internet World Wide Web set up to handle text sent back and forth in HTML format, you can send in XML format. So data being sent around in internet using XML, and going to work with XML a little bit. However text data being downloaded from internet.

the example Index.html, This is our first Ajax example shows us how to work with AJAX. Using AJAX techniques, this web application fetch data from server and replace this text with fetch data is goes here data fetches from server, see here, when you click the “display message” button, the text is fetched using AJAX.

This is first AJAX example, start look at how this works in Javascript. This is important part, is for this particular example in Javascript, what happens here is the element The first thing that this example does is creating an XMLHttpRquest Object.

XMLHttpRquest Object are what makes AJAX possible. These special objects built in all modern browsers allows you to connect to web server behind the scenes without causing page refresh. This is crucial part in AJAX, It’s XMLHttpRequest Object what makes AJAX possible, because using this object allow you to connect to the server behind the scenes and download data. So the first order in any Ajax application is to create XMLHttpRequest Object with which connect to the server.

So this Javascript, in this application starts by executing this code which creates javascript variable called XMLHttpRequestObject set to false so there’s nothing in the variable first.

var XMLHttpRequestObject = false;

Idea is now we have to create an XMLHttpRequest Object in order to proceed the rest of the Ajax application. So the way you create an XMLHttpRequest objects varies by browsers. So first work with non-microsoft browsers, we say

if (window.XMLHttpRequest)

This is the way we are checking, we’re working with non-microsoft browsers and if the window object supports XMLHttpRequest object creation. If so, this expression returns true. Then you can create XMLHttpRequst object like this

Set the variable

XMLHttpRequestObject = new XMLHttpRequest( );

And that creates new XMLHttpRequest object for you for ready to use Ajax in non Microsoft browser.

What if in Microsoft objects, in that case you check for the presence of window's ActiveX Object

if (window.ActiveXObject)

So this expression returns true then you have working in Microsoft Objects allow you to create XMLHttpRequest Objects. Then this is the way we do it, you set the XMLHttpRequestObject variable which was originally set to false. So new ActiveXObject(“Microsoft.XMLHttp”) ;

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

That is the way the Javascript statement we need in Microsoft browsers in order to create a new XMLHttpRequestObject which you need for AJAX.

Just recap, when the page first loads, this javascript executed.

Creates XMLHttpRequestObject set to false.

If not working in Microsoft objects then window.XMLHttpRequest returns true, if you create XMLHttpRequestObject in this way:

XMLHttpRequestObject = new XMLHttpRequest( );

Otherwise, if you are working in Microsoft browsers that supports creation of XMLHttpRequest object then create XMLHttpRequestObject in this way:

XMLHttpRequestObject = new ActiveXObject(“Microsoft.XMLHTTP”);

So after this script executed, you have XMLHttpRequest object, which is focus of all Ajax operations.

Examine this JavaScript code here :

var XMLHttpRequestObject = false;

if (window.XMLHttpRequest) {
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}