ColdFusion processing files uploaded with multiple attribute in input tag

[WolfShade]

Hello, all,

I'm attempting (for the VERY first time) to code a function that will take files posted via HTML5 form from an <input type="file" multiple="multiple" name="images" /> tag.

Specifically, how do I determine how many files were selected for upload on the server-side?

The aim is to use CFFILE to READASBINARY the images, then insert them directly into a MySQL database.  (This last part I think I've got down pat.)

V/r,

^_^

[WolfShade]

Has anyone worked with uploading multiple files from one input type="file" element???

V/r,

^_^

[EddieLotter]

I have not, however, what do you see when you dump the form variable after receiving a postback?

Cheers

Eddie

[WolfShade]

The form is posting to a CFC that does not output anything.  This is on a side project that I'm working on.  I could try that at work, though.  Hadn't thought of that.  (The usual - lack of sleep; not enough caffeine; etc.)

Thanks, @EddieLotter.

V/r,

^_^

[WolfShade · Accepted solution]

Okay.. this is CF10, so I don't have the luxury of setting forms to submit multiple elements (like checkboxes, radio buttons, or other elements that submit a comma-delimited list of data) as an array instead of a list.. however..

What I discovered is that the multiple file input submits a comma-delimited list of files.

So, what I've learned is that if the form is submit, use REMatchNoCase() on form.fieldnames looking for the name of the file input element, and the length of the array will be the number of files uploaded.

<cfif StructKeyExists(form,'manyFiles')>
    <cfdump var="#form#" />
    <cfset results = REMatchNoCase('manyFiles',form.fieldnames) />
    <cfoutput>There are #arrayLen(results)# files being uploaded.</cfoutput>
</cfif>

The downside to this VERY simplistic code is that the form element exists even if no file is selected, so it will always show as at least one.  Adding validation to make sure the one has something other than a blank value would be a good idea; but for the sake of brevity, I'm not adding that, here.

HTH,

^_^

[WolfShade]

Clearly I did not think this all the way through.

Yes, what I posted will tell me the number of files uploaded, but I'm not sure how to proceed with actually processing the uploads. 

SMH,

^_^

[EddieLotter]

That one's easy: cffile action="uploadall"

Cheers

Eddie

[WolfShade]

Thanks for the suggestion, but no.  I believe there is an issue with HTML5 input type="file" multiple="multiple".

What I did finally figure out was that if I use ListToArray(form.manyFiles), I get an array of all the temp file names.  I loop through the array and..

<cfset filesArray = ListToArray(form.manyFiles) />
<cfloop index="idx" from="1" to="#arrayLen(filesArray)#">
    <cffile action="readbinary" file="#filesArray[idx]" variable="filesArray[#idx#]" />
</cfloop>

This gives me an array containing the binaries of all the uploaded files.  Now I can loop through the array and I can either save them to disk, or I can put them into a database (without having to save to disk, first), or I can cffile action="writetobrowser".    Voila!

HTH,

^_^

[haxtbh]

Whats the issue you have? I use uploadall alot and never have issues.

Simply use upload all then loop through "cffile.uploadall_results"

i.e.

<cfif structKeyExists(form, "multipleUpload")>
     <cffile  action="uploadAll"  filefield="multipleUpload" destination="#temp#" nameconflict="MAKEUNIQUE"  />
     <cfloop from="1" to="#arrayLen(cffile.uploadall_results)#" index="i">
          <cfset file = cffile.uploadall_results>
          <!--- file var then works just like standard single file upload --->
     </cfloop>
</cfif>
<input type="file"   id="multipleUpload" name="multipleUpload" multiple="multiple"  />

[WolfShade]

Hi, haxtbh (the auto generated links are no longer working, for me),

Thanks, but I don't recall the exact forum where I had read it, but there apparently was some sort of issue with uploadall and an input type="file" multiple.

Also, the uploadall forces the files to be written to the server (or another) HD.  The way I outlined in my last post, you have options in regards to what you can do with the file(s) after they are uploaded.

The side-project that I am working on uses a hosting account that has limited web server storage, but almost unlimited database storage, so all the user-uploaded files are going into the database, not on the web server.  I'm also setting it so that if an image is larger than 1000 pixels high or wide, it will be automatically scaled down so that it will not be over 1000 pixels high/wide.  I'm also trying to limit it to gif and jpg/jpeg, nothing else.  Gotta keep the db size down so it's not TOO bloated. 

V/r,

^_^