Multiple image upload form

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • kayox007
    New Member
    • Nov 2008
    • 14

    Multiple image upload form

    How do i allow users to upload a minimum of 1 and maximum of 10 images? What is the best way to code this solution?
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    In your HTML code, have up to 10 input file fields with different names, e.g. file1, file2. A loop may help here, and you could keep a count or just make sure the files are numbered sequentially. You could improve this by only showing one and an add button for the rest up to a maximum of 10.

    On the server-side, use a loop for each upload file. If one doesn't exist, stop. Here you could use the count, but don't necessarily depend on it.

    If you need any help with the coding, post your code.

    Comment

    • acterry
      New Member
      • Mar 2010
      • 1

      #3
      Give the CFMU project a try: http://cfmu.riaforge.org/

      Also, Coldfusion 9 has a built-in multiuploader: http://www.remotesynthesis.com/post....n-9-in-5-lines

      Comment

      • bushnellweb
        New Member
        • Jan 2010
        • 48

        #4
        I usually just put all 10 file fields on the page and then if they want to only use 1 then my server-side code checks to see if that field's value is an empty string.

        Client Side:
        Code:
        <input type="file" id="fileImage1" name="fileImage1" class="small_text" size="60" /><br />
        						<input type="file" id="fileImage2" name="fileImage2" class="small_text" size="60" /><br />
        						<input type="file" id="fileImage3" name="fileImage3" class="small_text" size="60" /><br />
        						<input type="file" id="fileImage4" name="fileImage4" class="small_text" size="60" /><br />
        						<input type="file" id="fileImage5" name="fileImage5" class="small_text" size="60" /><br />
        						<input type="button" name="btnAddImages" value="Add Images" class="small_text" onclick="validateAdd();" />
        Server Side:
        Code:
        <cfif FORM["fileImage1"] IS NOT "">
        				<cffile action="upload" filefield="FORM.fileImage1" destination="#strServerDir#">
        			</cfif>
        			<cfif FORM["fileImage2"] IS NOT "">
        				<cffile action="upload" filefield="FORM.fileImage2" destination="#strServerDir#">
        			</cfif>
        			<cfif FORM["fileImage3"] IS NOT "">
        				<cffile action="upload" filefield="FORM.fileImage3" destination="#strServerDir#">
        			</cfif>
        			<cfif FORM["fileImage4"] IS NOT "">
        				<cffile action="upload" filefield="FORM.fileImage4" destination="#strServerDir#">
        			</cfif>
        			<cfif FORM["fileImage5"] IS NOT "">
        				<cffile action="upload" filefield="FORM.fileImage5" destination="#strServerDir#">
        			</cfif>

        Comment

        Working...