Home arrow ColdFusion arrow Page 3 - Multiple File Upload with CFFILE

Multiple File Upload with CFFILE

The author explains how to upload documents using the CFFILE tag in ColdFusion. He covers making a form that has an infinite number of fields, using CFLOOP. He starts with getting basic functionality, then moves on to the "fun stuff" -- multiple file upload.

Author Info:
By: Charles Kaufmann
Rating: 5 stars5 stars5 stars5 stars5 stars / 76
May 24, 2004
  1. · Multiple File Upload with CFFILE
  2. · Multiple Upload
  3. · Making it Pretty

print this article

Multiple File Upload with CFFILE - Making it Pretty
(Page 3 of 3 )

Below is the complete code with some final additions that will do a CFLOCATION back to the form page and display a message on the screen showing which files were uploaded and which form fields were blank.

Final Code:

1 <cfset numberoffields = 10>
2  <cfif isdefined("form.upload")>
3    <cfset message = "">
4    <cfloop index="i" from="1" to="#variables.numberoffields#" step="1">
5      <cfset filename = "form.file" & #i#>
6      <cfif evaluate(variables.filename) neq "">
7        <cffile action="UPLOAD"
8           destination="c:cfusionmxwwwrootNAPAfiles"
9           nameconflict="OVERWRITE"
10           filefield="#variables.filename#">
11        <cfset message = message & ",File%20#i#%20(#file.serverfile#)%20was%20uploaded">
12      <cfelse>
13        <cfset message = message & ",File%20#i#%20was%20empty">
14      </cfif>
15    </cfloop>
16    <cflocation url="FileUpload.cfm?msg=#variables.message#">
18 <cfelse>
19   <h2>File Upload</h2>20    <cfif isdefined("url.msg")>
21       <div style="color:#FF0000;">
22       <cfloop list="#url.msg#" index="i">
23         <cfoutput>#i#</cfoutput><br />
24       </cfloop>
25       </div>
26    </cfif>
27   <form action="FileUpload.cfm" enctype="multipart/form-data" method="post">
28      <cfloop index="i" from="1" to="#variables.numberoffields#" step="1">
29      <cfset filename = "file" & #i#>
30      <input type="File" name="<cfoutput>#variables.filename#</cfoutput>" /><br />
31      </cfloop>
32  <input type="Submit" name="upload" value="upload">
33  </form>
34 </cfif>

Let's briefly walk through the entire code and point out the changes. Let's start with the server side. The first new piece of code (line 3) is the CFSET, I am just initializing a list variable that will contain the message sent back to the client. Lines 4 through 10 are the same as before. Line 11 concatenates a message onto the list variable (message). The message we are creating is ",File (somefile.jpg) was uploaded) ". We are putting %20 for space markers (it is the hexadecimal to ascii equivalent). Line 12 is a CFELSE which handles the form fields that are blank. Line 13 creates a message like ", File4 was empty". So it just keeps looping, creating the message until the loop terminates then it goes to line 16, where it does a CFLOCATION back to the client side.

On the client side, the only changes made are to add the CFIF statement at the top (lines 20 to 26) to check if there are any messages sent from client part of the page. If there is a URL.MSG, it loops through the list because when we were creating the Message on the client side we kept on adding commas so that it would be a list (and thus easy to loop through).


So we started out with the goal of creating a versatile form for uploading multiple files. We accomplished the task by using two types of CFLOOP (an index loop and a list loop), and a couple other items of interest as needed. You can now use this form to accomplish all your uploading needs, and can easily change it so it displays one field or one thousand. A note of interest, if you also want to enter a record into a database that the image was uploaded and what the name is, you could put a CFQUERY statement before or after line 11. When you do the insert statement, use #file.serverfile# as the filename and not #form.filename#.

Have fun uploading, while being mindful of your disk space quota of course.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

blog comments powered by Disqus

- Adobe ColdFusion Just Got More RAD
- How to Access a SQL Anywhere Database with C...
- CFXML: Probing XMLDOM in ColdFusion
- Creating a Web Service with ColdFusion: the ...
- CFAjax: What it is and How to Use it
- Querying SQL 2000 Server from ColdFusion
- Introduction to ColdFusion Markup Language, ...
- Introduction to ColdFusion Markup Language
- Databases and Dreamweaver MX 2004, concluded
- Databases and Dreamweaver MX 2004
- Welcome to Coldfusion MX 6.1, concluded
- Welcome to Coldfusion MX 6.1
- What You Must Know About ColdFusion Flow-Con...
- What You Must Know About Operators in ColdFu...
- Everything You Must Know About ColdFusion Va...

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials