Whatever message this page gives is out now! Go check it out!

Uploading files

Last update:
May 18, 2026
The cffileupload tag lets you select multiple files and upload them to a server.

Working with the cffileupload

The cffileupload tag displays a dialog that lets you upload multiple files. The following are the file upload features:
  • Uses callback and error handlers that lets provides control over file upload process after upload completion or if errors occur.
  • Lets you style the file upload control
  • Provides option to stop or continue with upload in case of errors
  • Provides option to send custom response to callback and error handlers

Sending custom response to the callback and error handlers

The page/URL that handles the upload operation on the server can send back a struct with the keys status and message as shown here:
<cffile action = "upload" 

destination = "#Expandpath('./upload')#" 

nameconflict="makeunique"> 

<cfset str.STATUS = 200> 

<cfset str.MESSAGE = "File Upload Successful"> <cfoutput>#serializeJSON(str)#</cfoutput>
The following example illustrates the error handler:
<cftry> 

<cffile action = "upload" 

destination = "#Expandpath('./upload')#"> 

<cfcatch type="any"> 

<cfset str.STATUS = 500> 

<cfset str.MESSAGE = "Error occurred while uploading the file"> <cfoutput>#serializeJSON(str)#</cfoutput> 

</cfcatch> 

</cftry>
If the user tries to upload a file already present in the upload directory, it results in an error. The status and message are set to the specifications in the catch block.

Using styles

The attributes headercolor, textcolor, bgcolor, titletextalign, titletextcolor, and rollovercolor lets you style the file upload control.

The following example illustrates the styling of file upload control:
<cffileupload 
 url="uploadAll.cfm" 
 name="myuploader3" 
 align="right" 
 style="headercolor:silver;textcolor:1569C7;titletextalign:right;titletextcolor:black;bgcolor:74BBFB;"/>
The following code shows how the attribute onUploadComplete is used:
<!--- upload.cfm ---> 

<!--- <cffile action = "upload" destination = "#Expandpath('./upload')#" nameconflict="makeunique"> ---> 

<script language="javascript"> 
 var uploadCompleteHandler = function(obj){ 
 var result = "Upload Details:" + "\n\n"; 
 for(var i=0;i < obj.length; i++){ 
 result = result + "FILENAME: " + obj[i].FILENAME + "\n" + "STATUS: " + obj[i].STATUS + "\n" + "MESSAGE: " + obj[i].MESSAGE + "\n\n"; 
 } 
 } 

</script> 

<br> 

<cffileupload 
 url="uploadall.cfm" 
 name="myuploader" 
 onUploadComplete="uploadCompleteHandler" 
 maxUploadSize=100 
 stopOnError=false 
 />

Securing your uploads by default (by verifying the MIME type)

When you use the tag cffile for actions upload and uploadAll, the enhancements let you:
  • Use fittribute accept.
  • Check for proper MIME type of the file using strict=true by default.
Note: If you use multi-file uploader, there can be instances where the upload fails (for example, when MIME type or extension check fails) but the status in the uploader shows "Done". In such scenarios, you must trap the errors in the upload page and send back a serialized struct with MESSAGE and STATUS keys set to the error condition.

Share this page

Was this page helpful?
We're glad. Tell us how this page helped.
We're sorry. Can you tell us what didn't work for you?
Thank you for your feedback. Your response will help improve this page.

On this page