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 – http://manikandanmv.wordpress.com/2008/09/29/ajax-example/
Ajax POST request – http://manikandanmv.wordpress.com/2008/09/25/ajax-post-request/
Tags: AJAX, ajax example, ajax GET request, AJAX POST request, rendering part of the page, XMLHttpRequests
