RSS

AJAX

21 Nov

By Chris Cipriano

What AJAX isn’t

Before we talk about what AJAX is, let’s see what it isn’t.

  • AJAX isn’t a new technology
  • AJAX isn’t a programming language or scripting software
  • AJAX isn’t one thing at all

What is AJAX?

AJAX stands for Asynchronous Javascript And XML.

AJAX is a technique for creating fast and dynamic web pages. AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.

Classic web pages, (which do not use AJAX) must reload the entire page if the content should change.

  • standards-based presentation using 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
  • and JavaScript binding everything together

The traditional model for web applications (left) compared to the Ajax model (right).

History

AJAX (though it was refereed to as XMLHttpRequest at the time) started up when Microsoft shipped Internet Explorer 5 in 1999. In that version the browser could go talk to a server get some data and come back and update the page without reloading the page. Other browsers took note and shipped their own implementations shortly after. It got its first big break when Google noticed all browsers had support for this technology and started to use it with Google Maps and Gmail. Then in 2005, Jesse James Garrnett coined the phrase AJAX in an article.

How AJAX Works

  1. Some action triggers the event, like the user clicking a button.
  2. The AJAX call fires, and sends a request to a server-side script, using XML
  3. The server-side script (PHP, ASP, or whatever) takes the input from JavaScript, can access the database if it needs to, and processes the data.
  4. Using XML again, the script sends the data back to the original client-side page that made the request
  5. A second JavaScript function, called a callback function,catches the data, and updates the web page

Visual Representation

Try it out for yourself!

Uses for AJAX

Click HERE to see even more uses.

Helpful Links

AJAX is an enormous subject. What is written here is only an overview of the topic. So, here are a few resources that will you give you a more in-depth look at AJAX and how to use it.

  • Getting Started with AJAX– how to write a basic AJAX application
  • Mastering AJAX– a tutorial which gives you the basics and talks about cross browser compatibility
  • XAJAX– a tutorial to learn xajax in 10 minutes (an open source PHP Library for building ajax based applications)
Advertisements
 
3 Comments

Posted by on November 21, 2011 in web 1 blog

 

Tags:

3 responses to “AJAX

  1. dcgerz

    November 21, 2011 at 6:19 pm

    ajax seems like a really confusing thing to learn in depth based on your blog though, ajax is everywhere and it seems like most websites today use ajax in their layout. i feel like there has almost been an explosion of the use of ajax in the past couple of years especially with updating user content.

     
  2. Lillie

    December 2, 2011 at 6:11 pm

    Yes, AJAX is much more on the web development side than the web design side of things, but designers need to know what it is and how it can be used to enhance the dynamics and interactivity of a site.

     

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: