Machine Learning Authors: Pat Romanski, William Schmarzo, Yeshim Deniz, Liz McMillan, Jason Bloomberg

Related Topics: Machine Learning

Machine Learning : Article

What Is AJAX?

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

Trick 2
Observe that when you pass back HTML content to JavaScript, you have to URL-Encode the content (see Listing 7). If you try to pass back the HTML tags without encoding it, the AJAX calls will break without notice or error messages. In the receiving counterpart, you need to decode the HTML and this is achieved by using the unescape function as shown in Listing 6.

The drawback of this method is that it completely kills search engine friendliness. Search engines will not execute JavaScript calls and will not index your content. As a rule of thumb, I try to keep all front-end related content as SEO friendly as possible. You can use these examples for back-end related purposes. For example, gmail was written completely in AJAX. Notice that you can read and write e-mails and the site will never refresh and the speed is different over hotmail or any other Web mail application.

Table Example
Next, I'll cover looping over an AJAX record set and populating tables. Although you could generate the table and send the rendered HTML by using my previous content example, by using this technique, you'll delegate the load to the client browser instead of keeping it in the server.

I will introduce now a few DOM functions: createElement, createTextNode, setAttribute, appendChild, and removeChild. The concept here is to receive a recordset from a ColdFusion function and create the HTML by using DOM functions instead of the HTML tags.

In this example, I'll only demonstrate the JavaScript part that builds the table. If you look at Listing 8, you'll see an empty table with an ID in the "tbody" tag. This "tbody" tag is extremely useful when you have additional elements such as column headers in the "thead" tag. The "tbody" allows us to reference that section directly when adding and deleting elements.

The logical process that I follow in my pages is showing a "please wait" DIV when the user submits the request. At this point I make the AJAX call, send the request parameters, and wait for the response. The response will trigger the callback function, which immediately executes the "clear_table" function. This function loops over each row in the "tbody" and calls the DOM "removeChild" function. This will clear the results from the previous call. After I finished emptying the table, we proceed to populate it with the new recordset. If you look at the "showTable" function, you'll find two nested loops: one for each row and one for each column. Looping over each column is optional and up to you. Traditional ColdFusion programmers may prefer to loop over each row and manually code each column to their needs. Personally, I like to avoid having to write the same code over and over if I can help it. In my example, I created an array called "r" that contains the columns that I want to display. After you finish populating the table with the new recordset, you may remove the "please wait" message and the process is over.

Populating the table is actually rather simple: first I loop over each row from the recordset and create a "TR" element by using createElement('tr'); then in the nested loop I create the "TD" element for each column by using createElement('td'). The text is then evaluated in the following line "currenttext=document.createTextNode(eval('o.' + r[i] + '[j]'));". Here the "eval" function is resolving the recordset, then the column name, and then the position. For instance, the first row, first column, will read "o.uname[0]".

Creating the links is not as simple as typing "<a>". You will need to create an "A" element by using createElement('a'), and then use the setAttribute to add the href attribute.

After all is said and done, all that's left to do is to append each element to its parent. First you append the text node to the "a" element, then the "a" to the "td", then the "td" to the "tr", and finally the "tr" to the "tbody".

CFAJAX includes some utilities that facilitate this process but, the truth is, you will need to learn DOM JS if you really want to take control. For example, the example in Listing 8 only adds a link to the first column, and all the rest are just text.

Related Options Example
My last example will explain a useful built-in function with CFAJAX: related options (see Listing 9). How many times have you had to load enormous arrays of options to your HTML template to achieve this? Wouldn't it be great if you could load the dependent options only after the main option has been selected? CFAJAX includes two handy functions: "removeAllOptions" and "addOptions". These two functions will drive the JavaScript work to achieve related options to zero.

I hope the community doesn't mind, but I'll use the example from their site to demonstrate how this is achieved.

First, we'll have a brand dropdown that will call a JavaScript function called "getBrand" on its "onChange" trigger. All this function does is send ColdFusion the value of the current selected brand, and ColdFusion will return an array of values.

The array actually contains value pairs, which are the key, and the value separated by commas. It's important to pay attention to the hint value of the ColdFusion function; in this example, it's hint="type='keyvalue' jsreturn='array'", which is actually used in the callback function to set the expected value types. You can tell JavaScript the complex type of the return, set it to receive value pairs, and optionally set the delimited of the pairs. By default, it is expecting a comma for the delimiter.

The callback function cannot get any simpler. "getBrandResults" performs only two functions: DWRUtil.removeAllOptions("model"), which removes all current options from the model select component, and DWRUtil.addOptions("model", modelArray, "KEY", "VALUE"), which add the returned array to the model select component.

I hope you learned how AJAX could create a better user experience on your site. I covered passing complex objects, using innerHTML to modify the view layer after it has been rendered, drawing dynamic content, manipulating tables, and using related select options. AJAX is extremely fast, secure, and allows for advanced functionality that synchronous HTML does not.

More Stories By 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. As a head of Creative Technologies at Sapient, Gonda is an interactive technical “guru,” who provides the knowledge and experience required to run high-level, multi-channel interactive campaigns that reach millions of consumers. Gonda has more than 15 years of experience in web development and 360 marketing campaigns for clients such as Coca-Cola, Adobe, Guinness, Toyota, Taco Bell, NBC, and others. His areas of specialty include emerging technologies, marketing strategy, social media, digital out-of-home, mobile, behavioral targeting, and multi-channel synergy. Before joining the strategy and technology leadership teams at Sapient, Gonda was co-founder and chief technical officer at iChameleon, a Hollywood FL-based agency renown for its emerging experiences and creative technology. In addition to his agency work, Gonda the chair for the digital media council at the Advertising Research Foundation, is the former editor-in-chief of the AJAX Developer’s Journal, co-author of “Real-World AJAX: Secrets of the Masters”, a passionate blogger who authors www.takemetoyourleader.com, and contributors to various publications such as Ad Age and Ad Week. He is a frequent figure on the speaker circuit, having presented at conferences from the senate’s CIO emerging technology to SXSW and Omma. 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://takemetoyourleader.com

Comments (27) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.

Most Recent Comments
Swamy 04/21/08 03:57:36 PM EDT

Hi, I need a basic clarification. will Ajax can be implemented in ColdFusion 5 version(on IIS/oracle 9i). If yes, please help me by providing some information like How to setup engine files and how to get it worked in CF5.

karthikeyan Palani 01/20/08 03:21:17 AM EST

Hi Rob,
Thank you for the introduction for ajax with coldfusion .It is very easy to get started.

Hello Ajaxer 09/10/07 10:07:01 PM EDT

did u recognize the Ajax interface as you posted your feedback, or you have no clue what Ajax means?

ajaxer 09/10/07 09:36:31 PM EDT

too bad you didnt use AJAX on this site...

SYS-CON Brazil News Desk 04/06/06 10:25:25 AM EDT

It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999. Enjoy Rob Gonda's highly popular ColdFusion Developer's Journal article on AJAX, the hottest software development of 2005, with plenty more heat promised for 2006.

news desk 02/13/06 08:41:32 PM EST

It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999. Enjoy Rob Gonda's highly popular ColdFusion Developer's Journal article on AJAX, the hottest software development of 2005, with plenty more heat promised for 2006.

Rob Gonda 01/23/06 01:35:58 AM EST

Neither FF or IE will allow cross-domain scripting.

This is a securiry risk, read more here:

There are ways around it like a Server Side proxy, or third party JavaScripts like Ajax Extend (http://ajaxextended.com/)


Morgan 01/23/06 01:21:16 AM EST

Ok had a little time to kill and decided I'd give Ajax a try and see what all the hype was about. Downloaded and installed cfAjax folowed install directions step by step. all seemed fine untill I tried to run one of the sample applications. Then I got the following error.

Permission denied to call method xmlhttpRequest.open

I decided to load a full version of ajax and still got same error In looking for an answer I keep seeing the following as the culprit with no real solution.

This error occurs when you try to make requests off-domain.

which in pouring over the code I cant find anywher that the examples are making calls to off-domain. So lets cover the basics..

yes error is same in both ie and moxilla

no I'm not using a local file (ie //file/ajax/example)

no I dont have a firewall running between my work station and my development server

yes both machines are windows running IIS

yes the url has http (ie http://myDevelopmentServer/ajax/examples/text.htm

yes I created a virtual host for ajax in both IIS and my CF Administrator

So I guess that covers it Any help would be great

Robert Blackburn - DevBlog 01/17/06 09:52:59 PM EST

Trackback Added: What Is AJAX?; While I am on the topic of CFDJ articles, there is another one titled What Is AJAX?. This one begins a lot like my earlier p...

Baz Web Development: Ajax, FastCGI, Joomla 12/31/05 05:34:46 AM EST

Trackback Added: Another “What Is Ajax” Introduction; What Is Ajax?
— It’s become very popular lately, even though it’s not exactly new. It’s been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999. Enjoy Rob Gonda’s highly popu...

Rob Gonda 12/24/05 01:51:46 AM EST

Mohan, I am glad I could help; I definitely tried to make the article so easy and straight forward so everyone can get AJAX started. This will be one of the major topics for 2006.

To stay up to date with AJAX, please check my blog (www.robgonda.com) http://www.robgonda.com



mohan 12/23/05 08:20:53 PM EST

i am new to AJAX this is a wonderful article. After seeing this article i am going to implement CFAJAX in our (production) search form.

thank you veryyyyyyyyyy much

regards mohan

Rob Gonda 12/15/05 11:56:06 PM EST

Perhaps, nothing really prevented anyone from using it; Jesse James Garrett just had to come up with the idea/concept. By the way, don't miss Jesse at the Ajax Seminar (www.ajaxseminar.com/)

Rob Gonda 12/14/05 09:25:12 PM EST

It is indeed; AJAX involves combining any server scripting language with client side, hence, JavaScript. I can see how you could probably automate a two related select boxes without writing JavaScript, but certainly not an RIA or Web 2.0 application.

Editor 12/14/05 06:53:44 PM EST

SYS-CON will soon launch a dedicated online AJAX section but it will not be called "AJAX Developer's Journal" or "AJAX Magazine." Thanks and best regards.

P.S. Please stay tuned for SYS-CON's complete educational offerings to be announced soon.

Rob Gonda 12/13/05 10:54:35 PM EST

I just looked at the source code attached to the article, and you're right, it's missing model.cfm.
You may download the complete source code at

no comment 12/13/05 04:50:31 PM EST

I have cfajax working, but your example model.cfm doesn't do anything. What am I doing wrong?

news desk 12/11/05 08:17:11 PM EST

So What's AJAX? (Part One of Two) It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999.

ajax 12/11/05 05:09:45 PM EST

So What's AJAX? (Part One of Two)
It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999.

So What's AJAX? 12/11/05 05:01:05 PM EST

So What's AJAX? (Part One of Two)
It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999.

CFDJ News Desk 12/11/05 04:41:45 PM EST

So What's AJAX? (Part One of Two) It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999.

Rob Gonda 12/09/05 12:34:48 AM EST

by the way, check out my latest alternative to cfajax. I developed an ajax CFC framework.

check it out at http://www.robgonda.com/blog/projects/ajaxcfc/

Rob 11/26/05 07:06:09 PM EST

For more information please visit http://www.robgonda.com/blog

Rob 11/22/05 11:46:03 PM EST

Just testing this feedback again... Trying to find out exactly what's happening.

ColdFusion Developer's Journal News Desk 10/27/05 09:13:41 PM EDT

So What's AJAX? It's become very popular lately, even though it's not exactly new. It's been possible to use the concept behind AJAX since browsers introduced the XMLHttpRequest function in 1999.

Rob 10/27/05 08:40:25 PM EDT

I already wrote and submitted the second part of the article. It gets more in depth and provides lots of code examples.


Rob 10/27/05 08:38:08 PM EDT

Adam, I cannot help you with FB as I really dont use it much. I built my own MVC framework, but I was an active model-glue user. I can help you with MG or MII frameworks if it works for you.

@CloudExpo Stories
Business professionals no longer wonder if they'll migrate to the cloud; it's now a matter of when. The cloud environment has proved to be a major force in transitioning to an agile business model that enables quick decisions and fast implementation that solidify customer relationships. And when the cloud is combined with the power of cognitive computing, it drives innovation and transformation that achieves astounding competitive advantage.
Digital Transformation: Preparing Cloud & IoT Security for the Age of Artificial Intelligence. As automation and artificial intelligence (AI) power solution development and delivery, many businesses need to build backend cloud capabilities. Well-poised organizations, marketing smart devices with AI and BlockChain capabilities prepare to refine compliance and regulatory capabilities in 2018. Volumes of health, financial, technical and privacy data, along with tightening compliance requirements by...
"NetApp is known as a data management leader but we do a lot more than just data management on-prem with the data centers of our customers. We're also big in the hybrid cloud," explained Wes Talbert, Principal Architect at NetApp, in this SYS-CON.tv interview at 21st Cloud Expo, held Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA.
Andrew Keys is Co-Founder of ConsenSys Enterprise. He comes to ConsenSys Enterprise with capital markets, technology and entrepreneurial experience. Previously, he worked for UBS investment bank in equities analysis. Later, he was responsible for the creation and distribution of life settlement products to hedge funds and investment banks. After, he co-founded a revenue cycle management company where he learned about Bitcoin and eventually Ethereal. Andrew's role at ConsenSys Enterprise is a mul...
Evan Kirstel is an internationally recognized thought leader and social media influencer in IoT (#1 in 2017), Cloud, Data Security (2016), Health Tech (#9 in 2017), Digital Health (#6 in 2016), B2B Marketing (#5 in 2015), AI, Smart Home, Digital (2017), IIoT (#1 in 2017) and Telecom/Wireless/5G. His connections are a "Who's Who" in these technologies, He is in the top 10 most mentioned/re-tweeted by CMOs and CIOs (2016) and have been recently named 5th most influential B2B marketeer in the US. H...
The best way to leverage your Cloud Expo presence as a sponsor and exhibitor is to plan your news announcements around our events. The press covering Cloud Expo and @ThingsExpo will have access to these releases and will amplify your news announcements. More than two dozen Cloud companies either set deals at our shows or have announced their mergers and acquisitions at Cloud Expo. Product announcements during our show provide your company with the most reach through our targeted audiences.
DevOpsSummit New York 2018, colocated with CloudEXPO | DXWorldEXPO New York 2018 will be held November 11-13, 2018, in New York City. Digital Transformation (DX) is a major focus with the introduction of DXWorldEXPO within the program. Successful transformation requires a laser focus on being data-driven and on using all the tools available that enable transformation if they plan to survive over the long term. A total of 88% of Fortune 500 companies from a generation ago are now out of bus...
With 10 simultaneous tracks, keynotes, general sessions and targeted breakout classes, @CloudEXPO and DXWorldEXPO are two of the most important technology events of the year. Since its launch over eight years ago, @CloudEXPO and DXWorldEXPO have presented a rock star faculty as well as showcased hundreds of sponsors and exhibitors! In this blog post, we provide 7 tips on how, as part of our world-class faculty, you can deliver one of the most popular sessions at our events. But before reading...
DXWorldEXPO LLC announced today that "Miami Blockchain Event by FinTechEXPO" has announced that its Call for Papers is now open. The two-day event will present 20 top Blockchain experts. All speaking inquiries which covers the following information can be submitted by email to [email protected] Financial enterprises in New York City, London, Singapore, and other world financial capitals are embracing a new generation of smart, automated FinTech that eliminates many cumbersome, slow, and expe...
DXWordEXPO New York 2018, colocated with CloudEXPO New York 2018 will be held November 11-13, 2018, in New York City and will bring together Cloud Computing, FinTech and Blockchain, Digital Transformation, Big Data, Internet of Things, DevOps, AI, Machine Learning and WebRTC to one location.
As you move to the cloud, your network should be efficient, secure, and easy to manage. An enterprise adopting a hybrid or public cloud needs systems and tools that provide: Agility: ability to deliver applications and services faster, even in complex hybrid environments Easier manageability: enable reliable connectivity with complete oversight as the data center network evolves Greater efficiency: eliminate wasted effort while reducing errors and optimize asset utilization Security: implemen...
DXWorldEXPO | CloudEXPO are the world's most influential, independent events where Cloud Computing was coined and where technology buyers and vendors meet to experience and discuss the big picture of Digital Transformation and all of the strategies, tactics, and tools they need to realize their goals. Sponsors of DXWorldEXPO | CloudEXPO benefit from unmatched branding, profile building and lead generation opportunities.
@DevOpsSummit New York 2018, colocated with CloudEXPO | DXWorldEXPO New York 2018 will be held November 11-13, 2018, in New York City. From showcase success stories from early adopters and web-scale businesses, DevOps is expanding to organizations of all sizes, including the world's largest enterprises - and delivering real results.
With tough new regulations coming to Europe on data privacy in May 2018, Calligo will explain why in reality the effect is global and transforms how you consider critical data. EU GDPR fundamentally rewrites the rules for cloud, Big Data and IoT. In his session at 21st Cloud Expo, Adam Ryan, Vice President and General Manager EMEA at Calligo, examined the regulations and provided insight on how it affects technology, challenges the established rules and will usher in new levels of diligence arou...
Dion Hinchcliffe is an internationally recognized digital expert, bestselling book author, frequent keynote speaker, analyst, futurist, and transformation expert based in Washington, DC. He is currently Chief Strategy Officer at the industry-leading digital strategy and online community solutions firm, 7Summits.
"We started a Master of Science in business analytics - that's the hot topic. We serve the business community around San Francisco so we educate the working professionals and this is where they all want to be," explained Judy Lee, Associate Professor and Department Chair at Golden Gate University, in this SYS-CON.tv interview at 21st Cloud Expo, held Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA.
DXWorldEXPO LLC announced today that Dez Blanchfield joined the faculty of CloudEXPO's "10-Year Anniversary Event" which will take place on November 11-13, 2018 in New York City. Dez is a strategic leader in business and digital transformation with 25 years of experience in the IT and telecommunications industries developing strategies and implementing business initiatives. He has a breadth of expertise spanning technologies such as cloud computing, big data and analytics, cognitive computing, m...
Digital Transformation and Disruption, Amazon Style - What You Can Learn. Chris Kocher is a co-founder of Grey Heron, a management and strategic marketing consulting firm. He has 25+ years in both strategic and hands-on operating experience helping executives and investors build revenues and shareholder value. He has consulted with over 130 companies on innovating with new business models, product strategies and monetization. Chris has held management positions at HP and Symantec in addition to ...
Cloud-enabled transformation has evolved from cost saving measure to business innovation strategy -- one that combines the cloud with cognitive capabilities to drive market disruption. Learn how you can achieve the insight and agility you need to gain a competitive advantage. Industry-acclaimed CTO and cloud expert, Shankar Kalyana presents. Only the most exceptional IBMers are appointed with the rare distinction of IBM Fellow, the highest technical honor in the company. Shankar has also receive...
There is a huge demand for responsive, real-time mobile and web experiences, but current architectural patterns do not easily accommodate applications that respond to events in real time. Common solutions using message queues or HTTP long-polling quickly lead to resiliency, scalability and development velocity challenges. In his session at 21st Cloud Expo, Ryland Degnan, a Senior Software Engineer on the Netflix Edge Platform team, will discuss how by leveraging a reactive stream-based protocol,...