Storing file name when uploading using Coldfusion

Question

I am trying to store the filename of the selected file to be uploaded into a hidden input field on the form. my form looks like this

<form id="uploadattachment" enctype="multipart/form-data" 
       method="post" action="/governance/attachmentfilestore">

  <cfif isDefined("fileUpload")>
        <cffile action="upload"
                fileField="fileUpload"
                accept="application/pdf"
                nameconflict="makeunique"
                destination="#ExpandPath( '/files/governance/upr/' )#">


       <input type="hidden" name="filename" id="filename" value="">
       <input type="hidden" readonly id="uprUUID" name="uprUUID" 
               style="width: 400px" value="<cfoutput>#params.key#</cfoutput>"/>
       <input type="hidden" readonly id="status" name="status" 
               style="width: 400px" value="1"/>
       <input name="fileUpload" type="file" style="width: 200px;" />
       <button type="submit" name="action" 
               class="submitBtn primary rightSubmitBtnSpace">Upload</button>
</form>

This is then sent to the controller which writes it to the database how ever I cannot work out a way to get the name of the file to store in the "filename" field.

Does anyone have a solution on how you can populate a field with the name of the file that is selected to be uploaded?

I have added the CFFILE.serverFile in and it worked once, but I'm guessing thats because it grabbed the previously uploaded files name.

Now when loading the page I get Serverfile is undefined in CFFILE and so it does not let me populate the form with the files name.

My code looks like this now to try and work around it how ever this doesn't seem to work either.

<cfif isDefined("CFFILE.serverFile")>
    <cfset form.filename = CFFILE.serverFile>
<cfelse>
     <cfset form.filename = "null">
</cfif>
<input type="hidden" name="filename" id="filename" 
        value="<cfoutput>#CFFILE.serverFile#</cfoutput>"/>

Answer 1

The filename does not become available until the file is uploaded. This happens after the form is posted. The only way around this is to try posting the fileupload via AJAX and then returning the filename.

Otherwise, you can assign the value to the field after the file is upload and the form is posted.

    <cfset form.filename = CFFILE.serverfile>