Tagged in: AJAX
How does Ajax Work?
With Ajax, Web application finally starts feeling like desktop application to users. That is because Ajax enables your web applications to work behind the scenes, getting data as they need it, and displaying that data as you want. And as more and more people get fast internet connections, working behind the scenes to access data is going to become all the rage, soon, it will be impossible to distinguish dedicated desktop software from software that is actually on the Internet, far from the user’s machine.
- Standards-based presentation
XHTML and CSS
- Dynamic display and interaction using the Document Object Model
- Data interchange and manipulation using XML and XSLT.
- Asynchronous data retrieval using XMLHttpRequest
The key elements of Ajax
Ajax is not a single technology. Rather, it is a collection of four technoligs that complement one another.
Cascading Style Sheets (CSS)
CSS offers a way of defining reusable visual styles for web page elements. It offers a simple and powerful way of defining and applying visual styling consistently. In an Ajax application, the styling of a user interface may be modified interactively through CSS.
Document Object Model (DOM)
The XMLHttpRequest object allows web programmers to retrieve data from the web server as a background activity. The data format is typically XML, but it works well with any text-based data. While XMLHttpRequest is the most fliexible general-purpose tool.
Overview of the XMLHttpRequest Object
Method and Properties
|abort()||The current request.|
|getAllResponseHeaders()||Returns all the response headers for the HTTP request as key/value pair|
|gerResponseHeader(“header”)||Returns the string value of the specified header.|
|open(“method”,”url”)||Sets the stage for a call to the server. The method argument can be either GET, POST. The URL argument can be relative or absolute.|
|send(content)||Sends the request to the server|
|setRequestHeader(“header”,”value’)||Sets the specified header to the supplied value. Open() must be called before attempting to set any headers.|
Standard XMLHttpRequest Properties
|readyState||The state of request. The first possible value are 0=uninitialized , 1= loading , 2= loaded , 3= interactive and 4=complete|
|respoonseText||The response from the server as a string.|
|responseXML||The response from the server as XML. This object can be parsed and examined as a DOM object.|
|Status||The HTTP status code from the server (200 for OK, 404 for not found and so on)|
|statusText||The text version of the HTTP status code (OK or Not Found)|