Simple Quick AJAX and Usage

AJAX stands for Asynchronous Java-script and XML. AJAX is used to allow web pages to interact with server asynchronously by exchanging some amounts of data with the server. This is mainly used because it will not reload the whole part of the web page. Ajax will fetch the result through “XMLHttpRequest” object instead of  “http Request“. In a webpage there can me n number of Ajax requests. This Ajax request initiate from the client end and behind the scenes through XMLHttpRequest it manipulate the data.  The usage of Ajax in your we application is very very simple.

This Ajax can be used with any server side scripting languages like PHP, ASP, .NET, PYTHON … The syntax is very simple you can use anywhere in web app. All modern browsers support XMLHttpRequest but (IE5 and IE6) doesn’t support XMLHttpRequest though there is another way to send request to server for (IE5 and IE6) with Ajax that is ActiveXObject. So Ajax can be used anywhere. Here goes the syntax of Ajax.

Java-Script
var ajax;var output;
/* check for browser*/
if (window.XMLHttpRequest){
ajax = new XMLHttpRequest(); /* For Modern Browsers */
}else{
ajax = new ActiveXObject('Microsoft.XMLHTTP'); /* For IE5 & IE6 */
}
ajax.open("GET","ajax_request.php",true);
ajax.send();
ajax.onreadystatechange=function()
{
if (ajax.readyState==4 && ajax.status==200)
{
// some html output can be done here
output = ajax.responseText;
}
}

Open request parameters ajax.open(METHOD,URL,ASYNCHRONOUS)
METHOD = GET (or) POST
(GET is faster then POST. GET has limitation and POST has no limitation)

URL = Server URL may be (PHP, .NET, PYTHON, ASP…)

ASYNCHRONOUS = Boolean (True, False)
(True = Java-script will be executed till the response is received.
False = Java-script will not be executed till the response is received (ready state cannot be checked when FALSE.)

Asynchronous when set to true the Java-script will keep on executing onreadystatechange function till the response is received from the server. For checking the state of Ajax from the server there is an inbuilt 5 state levels.

onreadystatechange Stores a function (or the name of a function) to be called automatically each time the readyState property changes
readyState Holds the status of the XMLHttpRequest. Changes from 0 to 4:
0: request not initialized
1: server connection established
2: request received
3: processing request
4: request finished and response is ready
status 200: “OK”
404: Page not found

Leave a Comment

Your email address will not be published. Required fields are marked *

twenty + 5 =