AJAX – Asynchronous JavaScript And XML.


AJAX is a technique for creating web applications more interactive & responsive. It makes all applications better, faster and more user-friendly. AJAX is based on JavaScript and HTTP requests. AJAX uses asynchronous data transfer between the web client(browser) and the web server. You can get text/xml type of AJAX responses.


advantages.

  • increase the speed and usability of an application’s web page by updating only a part of the page.
  • webclient has to be more interactive and getting fast response.
  • reducing the number of requests to server. because css, js are loaded only once.

disadvantages

  • browser history not added
  • difficult to bookmark a page.
  • all browsers must enabled the javascript options.

Lets see how to implement this.

getXMLHttpRequest() – common method to get an instance of  XMLHttp request, using this to send a request as Ajax request

function getXMLHttpRequest()
{
var req;
if (window.XMLHttpRequest) { // For Firefox, Mozilla, Safari, …
req = new XMLHttpRequest();
}
else if (window.ActiveXObject) { // For IE
try {
req = new ActiveXObject(“Msxml2.XMLHTTP”);
}
catch (e) {
try {
req = new ActiveXObject(“Microsoft.XMLHTTP”);
}
catch (e) {}
}
}
return req;
}

sendAjaxRequest(url, divid) – method to send a ajax request, response is HTML and write the response text to given divid.

url – to send a request to the server (Ex: /testing.jsp)

function sendAjaxRequest(url, divid)
{
var req = getXMLHttpRequest();
req.onreadystatechange = function(){ processResponse(req, divid) };
req.open(‘GET’, url, true); // GET type request.
req.send(null);
}
function processResponse(req, divid)
{
if (req.readyState == 4) {
if (req.status == 200) {
document.getElementById(divid).innerHTML=req.responseText;
}
}
}

Ajax Example – https://manikandanmv.wordpress.com/2008/09/29/ajax-example/

Ajax POST request – https://manikandanmv.wordpress.com/2008/09/25/ajax-post-request/

Advertisements

Tags: , , , , ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


%d bloggers like this: