Integrate cffileupload with cfform?

Report · Apr 18, 2011

Is there a way I can use the multiple file upload capibilty of the cffileuplad tag on a cfform?

I need to be able to send form data (such as a email address) along with the files being uploaded.....I tried to add the cffileupload tag on the cfform, I hit the upload button on the cffileupload tag, and using the cfform tag, pointed the form action to the same processing page that the cffileupload tag uses......no luck....

Any idea how I can get the 2 to work together?

Report · Apr 19, 2011

If you are using the cffileupload tag (the flash upload component) with cffile action="uploadall", you seem to be unable to use any other form fields inside the cfform but the cffileupload - that's true to my experience too.

When you are using the cffileupload flash control, the processing page is called once for every file upload. This would lead to some problems already, having all your form data posted multiple times (count is equal to the number of files you uploaded).

Using multiple forms and javascript to post the forms could work for you. Place the form with the email address on the top of the page and make the user fill in the email adderss first - then he proceeds to the file upload form, and using cffileupload tag's onuploadcomplete="javascript_function_name" you post the email address form as well - at which point your page conveniently refreshes.

You can assign a (random) token beforehand to track which files are related to the email address. Use session variables or pass the token as url parameter to the form processing pages.

An alternative solution to this - which I haven't tested - would be to replace cffile action="uploadall" to action="upload", and see if you can then pass additional form fields inside the cfform. The theory behind this is, that we don't need the uploadall with the flash control, since the processing page is called once per every file anyway. Plus, maybe the action="uploadall" expectations for the input are stricter (files only), so it might work with the traditional action="upload" even with the asynchronous flash control.

-Fernis

Report · May 02, 2011

This has been a slight nightmare to say the least. I hope I come up with something

soon on this one. My basic issue here is that I cannot believe that this tag was

developed in such an incomplete manner. Anybody would relize that you have

to be able to read what you uploaded and the file name is kind of important to know

in order to read it.

Der Da Der.......:-)

Report · May 02, 2011

I gree it might be slightly tricky to use the tag, but I can tell you I have it implemented on a commerical site and it works better then alot of toher solutions out thete ... and we tryed SEVERAL before someing back to the CF TAG !!

3 importenet things.

1. The file UPLOADING is submit to the URL value of the Tag The file uplaoding will go to the page specified <cffileupload url = "SAVEPAGE.CFM" />

2. If you want to keep the session on the SAVEPAGE.CFM you need to ad this <cffileupload url = "SAVEPAGE.CFM?#urlEncodedFormat(session.urltoken)#" />

3. Any other value you want to pass, you can do it by using the Url.... BUT !!! since its done via the flash, you must use urlEncodedFormat() on what ever value u pass, in case it has spaces/any other carecters that need to be encoded.

You can NOT have a form that will post the IMAGES at the same time. the <cffileupload > stand as a tag, ot better say as UI on its own.

So I think you are both failing in the PROCCESS understanding not in geting the tag to work

Did both of you tryed the BASIC sample of the tag with 2 files :

<h3>Instructions</h3> 
<p>Create a folder Upload in your C: drive 
<br>Try uploading files using the file upload component and check if the files have been appropriately saved in the Upload folder.</p> 
 
<cffileupload  
    url="uploadFiles.cfm" 
    progressbar="true" 
    name="myupload" 
    addButtonLabel = "Add File" 
    clearButtonlabel = "Clear it" 
    hideUploadButton = "true" 
    width=600 
    height=400 
    title = "File Upload" 
    maxuploadsize="30" 
    extensionfilter="*.jpg, *.png, *.flv, *.txt" 
    BGCOLOR="##FFFFFF" 
    MAXFILESELECT=10 
    UPLOADBUTTONLABEL="Upload now"/>

Saveing file

IF this dosn't work then somthign else is not workign on your server.

An easy way to debug things is to place a <CFMAIL> <cfdump var="#form#"></cfmail> sending mail to your self, to see if the FORM gets submited !

Hope this will clear things up ...