AJAX First Steps
So, yeah, its Christmas eve...and guess what I had some extra time this afternoon! So, I decided to take some of the initial steps to learn AJAX. I decided to start off with prototype. For a pretty simple example I found a quick zip code lookup tutorial by Pete Freitag.
Here are the peices/parts:
The HTML
The JavaScript (ZipCode.js)
-
function checkZip() {
-
if($F('zip').length == 5) {
-
var url = 'checkZip.cfm';
-
var params = 'zip=' + $F('zip');
-
var fullUrl = url + "&" + params;
-
var ajax = new Ajax.Updater(
-
{success: 'zipResult'},
-
url,
-
{method: 'get', parameters: params, onFailure: reportError});
-
}
-
}
-
function reportError(request) {
-
$F('zipResult') = "Error";
-
}
The ColdFusion (checkZip.cfm)
There is also a zip code db (MySQL) for the data end of things.
Considering the lack of code I'm thinkin' that is pretty slick to get external data into an HTML page with no page refresh. I'm pleased so far.
Helpful resources found so far:
Quick Guide: http://particletree.com/features/quick-guide-to-prototype/
Scriptaculous Wikie for Prototype: http://wiki.script.aculo.us/scriptaculous/show/Prototype
Unofficial Prototype documentation: http://www.sergiopereira.com/articles/prototype.js.html#UsingAjaxUpdater
Merry Christmas!
