Introduction of Ajax

Short review of Ajax (asynchronous JavaScript and XML)

As the website technology was evolving there came a new technology in website development which is known as Ajax. Ajax stands for Asynchronous JavaScript and XML, you should keep this thing in mind that Ajax is a technique not a programming language. Actually Ajax became famous in 2005 after the auto suggestion box of Google search engine page.

The main benefit of Ajax is that it runs in parallel way and hence the page will not refresh after the call to another page. So Ajax is asynchronous call and the previous method was synchronous. Now people prefer to use jQuery inside of Ajax because jQuery is a framework of Ajax in which all major methods of Ajax is built-in and you just need to call these methods with appropriate parameters and in the end you will get the same result as Ajax even without implementation of method.

Procedure behind Ajax

With the help of Ajax your JavaScript can communicate directly with server using JavaScript XMLHttpRequest object. Ajax includes following things:

  • Standards-based presentation using XHTML and CSS
  • Dynamic display and interaction using the Document Object Model
  • Interchange and manipulation using XML and XSLT
  • Asynchronous data retrieval using XMLHttpRequest

Classic web application model (synchronous)



Ajax web application model (asynchronous)



First of all we have to send HTTP request to the server and in the return server will give us the desire data but here the main difference is that you need not to wait for the next page as the new data will come on the same page on which you sent the request so the page will not refresh.

States in Ajax

There are 5 different states of Ajax

State Description
0 The request is not initialized
1 The request has been set up
2 The request has been sent
3 The request is in process
4 The request is complete

Whenever you are going to call any Ajax script then in that case the XMLHttpRequest has to pass through some states and if we count these states then it will be five different stages. Stage 0 is that state in which there is not any XMLHttpRequest is being sent to the server, so request is being initialize. In second State An request is being set up, so here the initialization of XMLHttpRequest is been initialize. Then here comes State 2, in which the request which was initialized in the state 1, will be sent to the server. And after sending the request to the server the main process will start, which will depend upon the nature of the request being sent. And in the end there is a last state in which request is completed by the server and the final response is being sent to the client end. You must keep this thing in mind that all these calls are asynchronous and server will not be busy at any moment.

There are some methods which are being used for Ajax calls:

To send off a request to the server, we use the open() method and the send() method:

 
xmlHttp.open("GET","time.asp",true); 
xmlHttp.send(null); 
                        

Introduction to jQuery

As Ajax is becoming popular since 2005, so developers tried to make it simple because there are many things in Ajax which a programmer don't want during development as developer just want to minimize his work but he or she get 100% work and most importantly the work should be quick, So in order to compete these ideas developers made an framework of Ajax in which there are some methods whose definitions are building and you just need to call the function with appropriate parameters and in the end you will get your desire result.

If any developer wants to use jQuery instead of Ajax then the developer has to download the whole script of jQuery and then include the path of jQuery in your script. If you don't include the jQuery then you will not be able to implement any function. jQuery can be included in JavaScript tag and if any error can occur in the jQuery script then you can debug it using Firefox web developer add-on.

Copyright Notice: No part of this article may be reproduced, translated, stored in a retrieval system, or transmitted in any form or by any means without prior written permission from the HTTPDebugger.com

Read more articles

HTTP Debugger is a proxy-less HTTP sniffer for developers that provides the ability to capture and analyze HTTP headers, cookies, POST params, HTTP content and CORS headers from any browser or desktop application. Very easy to use, with clean UI, and short ramp-up time.
Download FREE 7-Day Trial

HTTP Debugger Pro

  • See all in/out HTTP traffic, HTTP headers, cookies, POST params, HTTP content
  • Isolate and fix performance bottlenecks, detect and eliminate security issues
  • Very easy of use, clean UI, and short ramp-up time. Not a proxy, no network issues!
Download Free Trial