What is AJAX?
AJAX’s most unique characteristic, is its “asynchronous” nature, which means it can do all of this without having to refresh the page. This lets you update portions of a page based upon user events.
With AJAX you can
- Update a web page without reloading the page
- Request data from a server – after the page has loaded
- Receive data from a server – after the page has loaded
- Send data to a server – in the background
Steps of AJAX Operation
- A client event occurs.
- An XMLHttpRequest object is created.
- The XMLHttpRequest object is configured.
- The XMLHttpRequest object makes an asynchronous request to the Webserver.
- The Webserver returns the result containing XML document.
- The XMLHttpRequest object calls the callback() function and processes the result.
- The HTML DOM is updated.
- abort(): Cancels the current request.
- open(method, URL, async, userName, password): Specifies the method, URL, and other optional attributes of a request.The method parameter can have a value of HTTP methods “GET”, “POST”, “HEAD”, “PUT” and “DELETE”.
- send(content): Sends the request.
- getAllResponseHeaders(): Returns the complete set of HTTP headers as a string.
- getResponseHeader(headerName): Returns the value of the specified HTTP header.
- setRequestHeader(label, value): Adds a label/value pair to the HTTP header to be sent.
- onreadystatechange: An event handler for an event that fires at every state change.
- 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
- responseText: Returns the response as a string.
- status: Returns the status as a number. eg. 200: “OK”; 404: Page not found
List of some famous web applications that make use of AJAX.
Google Maps: A user can drag an entire map by using the mouse, rather than clicking on a button.
Google Suggest: As you type, Google will offer suggestions. Use the arrow keys to navigate the results.
Gmail: Gmail is a webmail, built on the idea that email can be more intuitive, efficient and useful.