Wednesday 26 Nov 2014   
Add Comment

Ajax is Easy with CFAJAXPROXY Tutorial

ColdFusion Tutorial #13

How hard is doing Ajax? Well with ColdFusion 8 it's easy, very easy. This tutorial, shows just how easy it is to call CFC methods both without and with paramaters. Not only is it easy, the calls are quick, if you haven't tried Ajax, this is a must read.

In case you are not sure what Ajax is, it's the ability to communicate from the browser back to a server, without the need for page refreshes. The Ajax calls can also return values, so you have two way communication. You will notice that the results of the buttons in the demos are very quick and the browser does not refresh.

demo.cfm

The key to this whole thing is line 1. This setups a Javascript proxy to a CFC, in this example i've named the proxy the same as the CFC.

Then all you do is using javascript create an instance of the CFC proxy, then you can just call it's methods, it's that simple.

Line 5: Create the instance
Line 6: Setup the function name that will get called upon a sucessful call
Line 7: Call the method

Then the function starting at Line 10 gets the results and simply populates a div with the contents.

The second function, is the same but demonstrates passing a paramater, very easy.

Have a look at the demo to see it all working.



proxy.cfc

The cfc is just a normal CFC, only requirement is that the methods you wish to call have an access type of "remote". It's that simple, no tricks or magic.

How easy was that.



Demo

See this code running!


Download

Download this code as a zip!


Comments

Esta muy bueno el código, ya que permite usar AJAX sin tanto problema.
Cool Source Code.
Ya lo modifique y sirve de maravilla.
Gracias
avefenixtab @ Sunday 23 Mar 2008 - 02:05:54 AM

Anyone who buys that it's that easy hasn't tried to apply it yet. Try it with cfgrid. You'll find that Adobe has left it blowing in the wind.
vaughn @ Wednesday 26 Mar 2008 - 01:32:59 PM

This is a very clear, easy-to-follow example. I have to agree with vaughn, though - in other uses such as cfgrid, it is not nearly as easy. I find cfgrid to be buggy and ugly - just try resizing columning headers in the grid, for example - it will resize ONLY the header row, and not the data rows beneath - UGLY. Also, when you edit the contents of a cell in a data row in the cfgrid, it puts a red triangle in the upper left hand corner of the cell - UGLY. But, I'll give the author of this article props for the example here - for simple uses such as this example, it is good practice.
Brian @ Saturday 06 Dec 2008 - 03:03:50 AM

Very impressive example, making ajax simply sitting in our hands..
cf8 is absolutely great
cfsavvy @ Friday 05 Jun 2009 - 03:12:46 PM

Dude its Awesome!
I had no idea about ajax before but you guys makes it simple and easier to understand.
Thnaks,
Nics
NIcs @ Tuesday 01 Dec 2009 - 06:36:27 PM

New to Ajax.
I have downloaded both cfm and cfc files and put on our Web server. When I run the program, clicking either the Server Time button or the reversing phrase button returns a null value. Sysadmin said that he had done everything he could but still no valid result. Any suggestions?
Yuhang @ Thursday 13 May 2010 - 05:54:21 AM

Helps with iis problems
<cfset pathToCFC = replace(replace(cgi.SCRIPT_NAME,'/','.','All'),listLast(cgi.SCRIPT_NAME,'/'),')>
<cfset pathToCFC = mid(pathToCFC,2,len(pathToCFC)-1)>
<cfajaxproxy cfc="#pathToCFC#.proxy" jsclassname="proxy" />
andy @ Wednesday 09 Feb 2011 - 09:43:49 PM

Thanks.Very helpful.
Srinivas @ Friday 22 Jul 2011 - 04:11:03 AM

This was a great one.
Walliyaw @ Thursday 25 Aug 2011 - 11:09:43 AM

good and easy
Serega @ Thursday 25 Aug 2011 - 11:45:13 PM

Very good example which helped me to start with Coldfusion/AJAX.
Yvo @ Monday 06 Feb 2012 - 11:55:55 PM

Click button to add a comment


Author

Paul James


Published

Wednesday 17 Oct 2007

Tags

cfajaxproxy  cfargument  cfcomponent  cffunction  cfreturn  cfset