Web designer logo web designer nepal freelance web developer nepal web developer nepal
Home Ajax: A New Approach to Web Application

Aug 27
2009

Ajax: A New Approach to Web Application

Posted by: admin in HTML, CSS, Javascript, PHP

Tagged in: AJAX

admin

Ajax (Asynchronous JavaScript and XML) isn’t a technology. It is really several technologies, each flourishing in it’s own right, coming together in powerful new ways.

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.


Ajax incorporates:

  1. Standards-based presentation
    XHTML and CSS
  2. Dynamic display and interaction using the Document Object Model
  3. Data interchange and manipulation using XML and XSLT.
  4. Asynchronous data retrieval using XMLHttpRequest
  5. and JavaScript binding together

 

The key elements of Ajax

Ajax is not a single technology. Rather, it is a collection of four technoligs that complement one another.

JavaScript

Jacascript is a general purpose scripting language designed to be embedded inside applications. The javascript interpreter in a web browser that allows programmatic interaction with many of the browser’s inbuilt capabilities. Ajax applications are written in Javascipt.

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 DOM presents the structure of we pages as a set of programmable objects that can be manipulated with JavaScript. Scripting the DOM allows an Ajax application to modify the user interface on the fly, effectively redrawing parts of the page.

XMLHttpRequest Object

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

You must first create an XMLHttpRequest object using JavaScript before you can use the object to send requests and process responses. You can use JavaScript in a couple of ways to create and instance of XMLHttpRequest. Internet Explorer implements this object as an ActiveX object, and other browsers such as FireFox, Safari and Opera implement it as a native JavaScript object. Because of these differences, the javascript code must contain logic to create an instance of XMLHttpRequest using the ActiveX and native Javascript object technique.

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

onreadystatechange The event handler that fires at every state change, typically a call to a javascript function.
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)

For free updates from author: Nirmal Gyanwali enter your email address:

Delivered by FeedBurner



busy

Publish Article

Welcome!

Nirmal: Freelance web designer and developer from nepalMy name is Nirmal, a Freelance Front-end Web Developer based on Sydney, Australia. I am currently working as a Chief Technology Officer at Marketing Eye, Sydney and also pursuing Web Technology Specialization degree from Macquarie University, Australia.  I am well versed with Open source CMS and portal frameworks like Joomla, Drupal, Wordpress.

If you have something to share about Information Technology, this site is open for guest blogging. Send me your blog post at info@nirmal.com.np.

Nirmal's Travel Photo Blog

Nirmal's Nepali Blog on Information technology

Nirmal's Programming Blog, JAVA, oracle, c++, sql, vb.net

Nirmal's Modeling portfolio, Nepali Male Model Nirmal, Glamorous Photo of Nirmal

Popular Tags

Content View Hits : 12159302