…The Cleanest, Slickest Sites In Town.
Presented By Scott "The Turtle"
Wenzel.
LIVE BLOG
What is AJAX it stands for Asynchronous
Javascript And XML. It’s not a product you can buy
but a methodology in web programming. The best way to describe it is why
update a full webpage when you can just update the object on the webpage
that you are changing. A great example of this would be Google Maps
or gMail.
How does it work. Well in IE5 MS added
a request type called XMLHttpRequest which has now been added to most major
web browswers like FireFox etc. This request can allow Javascript to pull
back XML content so you can then change the Document Object Model with
this data. Domino is a great backend for this XML as you can design
your views etc to output the correct data. Think lookup views that output
xml.
The InnerHTML property of any DIV can
be used to contain the new data that has been retreived from the server.
Scott has just shown a very funny demo
of a webpage that needs to reload every time you click on an option and
then moved onto Google Maps where he is showing the code that runs it.
It’s got lots of JavaScript but it only needs to load it up once.
If you want to try figure it out yourself then do a search of the code
for XMLHttprequest to find the main part.
So why not just load all the data at
once. Well as an example Scott mentioned that if you had to download all
the Starbucks locations around the world then you would be waiting for
ages but by using AJAX you just have to download the main form and then
pull the data you need using AJAX based on the selections of the user (
like Country, State, Town etc ).
One thing to note is that it is NOT
cross domain, you cannot get the XMLHttpRequest on server xyz.com to pull
data from qwerty.com
Basic uses of AJX can be things like
context sensitive help ( onmouseover could trigger the request to grab
the data ). Instructional systems that can guide users through a form or
site, populating options arrays without reloading pages, The ObjectGraph
Disctionary is a great example
of what is known as a Word Wheel that pulls in data as you type.
Possible Pitfalls
Well the first thing you notice is that
the ‘Back’ button breaks. Clicking on the back button ( or refresh ) won’t
remember your options.
You need tto check your Status Code.
You can’t use the data if it doesn’t get back to the browser. So always
wait till you get a status code ( 200 – successk, 404 – not found )
And don’t overdo it. it’s easy
to make your site look like a circus.
Dec's Dom Blog 