What Is AJAX? | SYS-CON BELGIUM

What Is AJAX?

AJAX isn't a technology, or a language, and there's no recipe to implement it

Sep. 10, 2007 05:15 PM

Now let's create a small application that could actually benefit you. How many times have you created a registration form that can validate almost everything client-side by using JavaScript, but the username has to be validated upon submission, and if it already exists, you either have to abort and use JavaScript for the alert and send the client back, or cflocate and populate all the form fields by using the session. Wouldn't it be great if we could avoid all that and simple check the username as another JavaScript call? And not even think of creating an existing username array and have it local in the registration form?

It 's not that much different from the file we have. Let's modify the index.cfm file a little. We'll create a basic user registration form with a single fieldname called user and we'll pass that value to the AJAX call. The tricky part here is that AJAX is asynchronous, which means that the function won't return the value you need. Instead the callback function will get called on a different thread. Not to worry, I'll demonstrate how this can be done.

model.cfm
<cfinclude template="core/cfajax.cfm">
<cffunction name="userExists" returntype="boolean">
   <cfargument name="event">
   <cfset var return = false />
   <cfif ListFindNoCase('rob,john,paul',event)><cfset return = true /></cfif>
   <cfreturn return />
</cffunction>

Index.cfm now contains a user registration form. On submit, we'll call checkUser(). Note that we must actually call it with a return parameter or we'll always return false! No matter what happens, the form won't get submitted the traditional way. Note that I included 'utils.js' only to call the 'useLoadingMessage' function, which imitates the Gmail loading message while AJAX makes its round trip. 'Execute' sets a callback function, which checks for the ColdFusion return. If true, we'll display an error message, and if the user doesn't exist, we'll manually submit the form by using the JavaScript submit() function. The only difference in the execute call is that we pass the form value to the ColdFusion model. The CFM page is straightforward: all we're doing is a dummy check against a hard-coded list. This is the place where you would put your queries or invoke your components.

You should now be able to set up an AJAX engine, a simple HTML view, make a call, listen, process, and respond using ColdFusion, and process the response in your callback function. In the next part of this article, I'll explain how to pass complex objects by using WDDX serialization, populate tables, use innerHTML properties for advanced JavaScript view manipulations, and provide a full internal rotating banners application that tracks impressions and clicks. I will also cover cross-browser compatibility and offer some little tricks to make your AJAX application as widely compatible as possible.

Published Sep. 10, 2007— Reads 202,713 — Feedback 27
Copyright © 2007 SYS-CON Media, Inc. — All Rights Reserved.
Syndicated stories and blog feeds, all rights reserved by the author.

▪ A Cup of AJAX? Nay, Just Regular Java Please

▪ Hangover Thoughts About the Web and AJAX

▪ Integrating AJAX with the JMX Notification Framework

▪ ClearNova Exec Defends Open Source AJAX Development vs Java

Related Links

▪ AjaxCFC Project

▪ Rob Gonda's Blog

About Rob Gonda
Rob Gonda is an industry visionary and thought leader, speaks on emerging technologies conferences nationwide, and combines unique approaches to technology and marketing strategies. He is the former Editor-in-Chief of the AJAX Developer’s Journal, an Advanced Certified Coldfusion Developer, member of the Adobe Community Experts, frequent contributor to the CFDJ and ADJ, co-author of Real-World AJAX: Secrets of the Masters, author of AjaxCFC, holds a BS in computer science and engineering and an MBA with a specialization in entrepreneurship. Rob recently joined Sapient from ichameleon/group/ where he was a founding partner and chief technical officer. He is part of the global technology leadership team, and brings with him over ten years of experience in web development and 360 marketing campaigns for clients such as Adobe, Coca-Cola, Guinness, Toyota, Taco Bell, NBC, and others. He specializes in emerging technologies, marketing strategy, social media, and he is currently fascinated with rich internet applications, service oriented architecture, mobile, agile methodology, automation, behavioral targeting, multi-channel synergy, and identifying new trends. Rob’s mission is to develop forward-thinking expertise that will ensure clients are always on par with rapidly changing technologies and maintain its ethos of evolving. You can reach him at rob[at]robgonda[dot]com and read his blog is at http://www.robgonda.com