Uploads Made Simple

Using <cffile> (ColdFusion)

Uploading files with <cffile> is fairly straightforward. This is largely because ColdFusion's FORM variables are still intact when the enctype="multipart/form-data" attribute is added to the <form> tag. However, we do have one minor wrinkle to consider. Because we edited the Insert Record SB by hand in Chapter 12, we won't be able to use the Server Behaviors panel to revise the INSERT statement. We're not going to let that stop us, are we?

Launch Dreamweaver MX and open addListing.cfm. Follow these steps to apply the <cffile> tag:

1.  Switch to Code view and insert a new line after the opening <cfif> tag on line 2.

2.  Select the CFML Advanced tab on the Insert bar and click the cffile button. This launches the Cffile tag editor.

3.  Make sure Upload is selected from the Action drop-down menu and enter File1 in the File Field text box.

4.  Type #ExpandPath("../images/listings")# in the Destination Path text box.

5.  In the Accept Files text box, enter image/*.

6.  Choose Makeunique from the Filename Resolution drop-down and leave the other text boxes empty. Click OK.

7.  Now we're going to add some code to confirm that the image was uploaded. Insert a new line after the <cffile> tag and select the CFML Flow tab on the Insert bar. Hold down the CTRL key and click the isDefined button (holding down the CTRL key bypasses the dialog box).

8.  Type FILE, followed by a period (.). Code Hints pops up with a list of available FILE parameters. Choose FileWasSaved and press ENTER.

9.  Place your cursor between the opening and closing <cfif> tags and select the CFML Basic tab on the Insert bar. Click the cfset button. Complete the <cfset> tag as follows: <cfset FORM.File1 = FILE.ServerFile>.

Save your work. The completed code should look like this:

<cffile action="upload" filefield="File1"
destination="#ExpandPath("../images/listings")#"
nameconflict="makeunique" accept="image/*">
<cfif isDefined("FILE.FileWasSaved")>
<cfset FORM.File1 = FILE.ServerFile></cfif>

For some reason, Code Hints doesn't appear when you type CFFILE, even though FILE is deprecated in ColdFusion MX. In any case, let's take a closer look at the code we just inserted.

How the Code Works

The <cffile> tag has three required attributes: action, filefield, and destination. Possible values for the action attribute include upload, rename, move, and delete. The filefield attribute expects the name of the form's file field (e.g., File1). The destination attribute requires the absolute path to the file or directory on the server. In order to extract this value from a relative path, we use the ColdFusion ExpandPath function. The nameconflict attribute, which is optional, accepts four possible values: error, skip, overwrite, and makeunique. If makeunique is specified, ColdFusion creates a unique filename for the upload and stores it in the FILE parameter, ServerFile. The accept attribute, also optional, allows you to require specific MIME types (e.g., accept="application/pdf"). You can also use wildcard characters (e.g., accept="image/*") or a comma-delimited list (e.g., accept="*.gif,*.jpg,*.png").

If the file upload is successful — i.e., if the FILE.FileWasSaved status parameter evaluates to true — we set the FORM.File1 variable to FILE.ServerFile. This way, if ColdFusion changes the filename to make it unique, the new filename is inserted into the database. For more information about <cffile>, consult the CFML Reference.

Download Article as PDF