The Asynchronous Javascript And XML Computer Science Essay

Published: Last Edited:

This essay has been submitted by a student. This is not an example of the work written by our professional essay writers.

Asynchronous JavaScript and XML (AJAX) is not a programming language and it is a web development technique that uses to develop a more interactive and faster dynamic web pages. It can be a combination of technologies which incorporate data retrieval by using XMLHttpRequest, communication advancement by using JavaScript, standards- based interaction by using CSS, and also data exchange by using XML.

Through the combination of technologies, a web page is possible to update a part of it only without refresh the entire web page. It is because AJAX allow web page to execute other tasks or exchanging small amounts of data while waiting for a response from web server. It means that the data can be retrieved asynchronously from the web server without disturbing the display of information presented in the existing page. Compare to the classic web page that does not use AJAX, the whole web page must be reloaded if the content changes to get the latest information.

Comparison between classic web page model (top) and AJAX web page model (bottom).

With the classic web page model, all of user action trigger HTTP request from the user interface must be sent to the web server in order to response. It is time- consuming and low interactivity as the users cannot get the immediate feedback from the web server. It means that the page must be refreshing for every action to get or update the latest information.

However, AJAX engine that are introduced by AJAX are works within the web browser to control the communication between web browser and web server. When the user initials a web application, the web browser will load an AJAX engine for user to interact with the web server independently and asynchronously. Therefore, users can interact with the application while waiting for the web server to load the webpage for them without doing anything.

Besides, AJAX engine also handling all of the requests from the users. It can hold as much as possible of information in its engine itself. Some of the simpler task can be handled by the AJAX engine on its own such as simple data validation, navigation and others simpler without send it back to the server. Engine will trip back to the server only whenever engine needs a response from the server like processing submitted data or retrieving new data. However, the engine will still maintain the interaction between user and application by making the request asynchronously.

AJAX has lots of advantages. One of the advantages of using AJAX is save bandwidth. With the AJAX web application, the web browser is no needs to transmit the full content of HTML form to the server which will waste a lot of bandwidth. It only send or retrieve the required information to or from the web server, traffic travel between client and server can also be reduced.

The second advantage is faster response time. AJAX provides an immediate feedback to the user even though the changes are still not done yet in the server side. Through this way, user can also save a lot of time without waiting server response to each action. Therefore, AJAX not only takes advantage in time, but also increases web page interactivity, usability and also speed.

Even though the advantages of AJAX are strong but there are disadvantages and potential risks associated with it. Security is one of the disadvantages. Some of the analyst did not put validation for the incoming data to the web server and therefore injection attack occurred. Outsider can easily hack into the server and abuse the information stored in the database.

Another disadvantage is JavaScript dependency. AJAX use JavaScript code which has no code security. AJAX functionality rendered useless when there is a problem stay within the users' browser or operating system.

Question 2: How to apply AJAX with ASP.NET

For Asynchronous JavaScript and XML (AJAX), there is no any special plug- in browser required. Several different technologies are required to use AJAX such as XML, XMLHttpRequestObject, DOM accessed with a client- side scripting language and HTML and also CSS.

There are 4 steps to apply AJAX in ASP.NET project.

Step 1: To develop a XML HTML Request Object

The XML HTML Request Object is developed by AJAX for the web browser to enable it to talk to the web server. However, different browsers have different handling skills. Internet Explorer using Microsoft.XmlHttp ActiveX Object while others browser such as Firefox and Safari are using XMLHttpRequest Intrinsic Browser Object. Therefore, JavaScript code needs to check the type of the browser first before proceed to create an object on it.

Example code for different browser will use different object.

Step 2: Create function to send request to the server.

AJAX initiate the object by using open ( ) method. The open ( ) method can fix up to five parameters. Basically, three parameters only are included in the open ( ) method. The first parameter is either GET or POST which related to the type of request. The second parameter is server side script target URL in .php form which is either absolute or relative. The third parameter is set the default as true as make the request asynchronous. The fourth and fifth parameters are for authentication use. It is used to provide username and password if the HTTP request for it. After AJAX had done with the open ( ) method, HTTP request can be sent out through send ( ) method.

Example code for send request to the server

Step 3: Create callback function to get or receive server response.

Once the server want to pay a response back to the HTTP request, this function will be called. The readyState indicates the state of XMLHttpRequest Object. If the readyState value is 4, then the request is complete. There are two properties use to provide the return value which is reponseText and also responseXML. ResponseText is used when need to return the data as a string while responseXML is used when need to return data in an XML document.

Example code to get response for the server

Possible value for readyState

Step 4: Process server response and update HTML DOM

The HTML page will be updated in this step. JavaScript can now add, delete or edit child elements or style properties by get a reference in page using DOM API. Not only that, JavaScript can also set the values of a field in the page when the server response is back. Besides, responseXML property requires the server to return a well- formed XML data so that the client script can parse it. However, it is easy to access because JavaScript supports a set of DOM features to access specific modes in the XML file.

Question 3: Reference


Ajax: A New Approach to Web Applications - Adaptive Path. 2012. Ajax: A New Approach to Web Applications - Adaptive Path. [ONLINE] Available at: <> [Accessed 20 October 2012]

AJAX: Introduction and Advantage | Ajax Blog. 2009. AJAX: Introduction and Advantage | Ajax Blog. [ONLINE] Available at: <> [Accessed 20 October 2012]

Jennifer Kyrnin. 2012. What is Ajax?. [ONLINE] Available at: <> [Accessed 20 October 2012]

O'Reilly Media Inc.,(2005) Mastering Ajax, Part 1: Introduction to Ajax [ONLINE]. Available at: <>  [Accessed 24 October 2012]

Electronic Image

PHPLETTER, (2007), What is Ajax? [image online] Available at: <> [Accessed 20 October 2012]

O'Reilly Media Inc., (2007), Mastering Ajax, Part 1: Introduction to Ajax [image online]. Available at: <>  [Accessed 24 October 2012]

John Melton, (2005), 5 easy steps to Ajax [image online]. Available at: <> [Accessed 24 October 2012]

Question 5: Word Count

Total number of words for the report: 1126 words.