AJAX File Uploader for ColdFusion
Uploading files with AJAX is a unique challenge due to the fact that file uploads require a form "post" with enctype="multipart/form-data". To get around this people have used a combination of IFrames and AJAX.
Uploading files with AJAX is a unique challenge due to the fact that file uploads require a form "post" with enctype="multipart/form-data". To get around this people have used a combination of IFrames and AJAX.
I've been pondering this question due to a project I built with ColdFusion 8 AJAX. If you've ever attended an Adobe Roadshow event you've seen the showmanship in action. Exciting demos that let you build entire apps with the click of a button or new tags that add complex functionality with very little effort. I don't have a problem with these demos, it's the missing "warning label" that I'm concerned with.
I'm on a redesign project for a site that I built in 2007. The site uses the Adobe Spry Framework for dynamic menus. The problem is the redesign is centered not left justified and the dynamic menus appear to the left of my design when "hidden". I assume this is a bug. The div's should be hidden not moved to the left.
Anyhow, I thought I'd visit Adobe Labs and download the newest version of the Spry Framework. Who knows this might be a bug that has been corrected. Nope I've got the latest version 1.6.1.
If you are having this problem try the following.
Of course, be careful. You don't want to enable the AJAX Debugger on your production machine.
Happy Coding.
I've been using the nifty date chooser widget in ColdFusion 8 and love it. Using the <cfform> tag and a <cfinput> tag you simply add the type="datefield" and mask="MM/DD/YYYY". You'll see a small image of a calendar appear next to your input form and when you click on it a nice calendar date chooser will appear.
My problems begain when I tried to use this same code inside a .cfm page and used the bind (cfdiv) or source (cfwindow) attribute to point to this separate page. The small calendar image would not appear. I thought this had something to do with the asynchronous nature of cfdivs and cfwindows.
But, I've descovered the problem.
1. I did not map the CFIDE directory and instead copied all the content of /CFIDE/scripts/ into a directory off the root called /js/cf8/. Then I used <cfajaximport scriptSrc="/js/cf8" tags="cfform,cfdiv,cfinput-datefield">. This SHOULD work. But it didn't. Thanks to the FireBug plug-in (Love this plug-in, if you don't have it running in Firefox 3 get it now). Firebug allowed me to see the source of my external.cfm file. I found the problem.
Here is the image tag for my main page calendar icon.
<img id="myDatemyForm_cf_button" src="/js/cf8/ajax/resources/cf/images/DateChooser.png"/>
And here is the image tag for my external page calendar icon.
<img id="myExternalDatemyExternalForm_cf_button" src="/CFIDE/scripts/ajax/resources/cf/images/DateChooser.png"/>
No good!
So, my solution. Create the directory "/CFIDE/scripts/ajax/resources/cf/images/" off my webroot and copy the image contents.
Voila! the calendar image appears and the date chooser works great.
Happy coding.
Recent Comments