How to make multiple selecting item while upload file.

[Decamm]

Hi there, here i post new article because need to improve my upload function.
What i want is to make my selecting item for uploading file to be multiple select, only by pressing "ctrl" button,
like yahoo mail does. Here I create a code for upload file but the problem is, only one file for select in one time, and i make it available to add another upload form.

<cfparam name="form.title" default="">
<cfparam name="form.attachment" default="">
<cfparam name="form.attachment1" default="">
<cfparam name="form.file_type" default="">

<h2>New Upload</h2>
<script type="text/javascript">
     var upload_number = 2;
     function addFileInput()
     {
     var d = document.createElement("div");
     var file = document.createElement("input");
         file.setAttribute("type", "file");
         file.setAttribute("name", "attachment"+upload_number);
         d.appendChild(file);
         document.getElementById("moreUploads").appendChild(d);
         document.getElementById("totalAttachments").value = upload_number;
         upload_number++;
     }
</script>


<cfif structKeyExists(FORM, "totalAttachments")>
         <cfset currentDirectory = GetDirectoryFromPath(GetTemplatePath()) & "uploaded">
         <cfparam name="FORM.totalAttachments" default="0">
         <cfloop from="1" to="#form.totalAttachments#" index="counter">
         <!--- verify the form field exists --->
         <cfif structKeyExists(FORM, "attachment"& counter)>
              <!--- try and upload it ...--->
              <cffile action="upload" 
                        fileField="attachment#counter#" 
                        destination="#dir_path#"
                        nameconflict="MAKEUNIQUE">
            </cfif>
         </cfloop>
</cfif>



<cfif isDefined ("form.submit_upload")>
    <cfif Form.attachment NEQ "">
            <cfset dir_path = "#Application.fw.Config.data_path#\home\">
            <cffile 
                action = "upload"
                fileField = "attachment"
                destination = "#dir_path#"
                nameConflict = "MakeUnique">
                <cfset file_type = #ListLast(cffile.ServerFile, '.')#>
    </cfif>

    <cfif Form.attachment EQ "">
        <cfquery name="qInsert" datasource="#Application.fw.Config.DSN_Profile#">
            INSERT INTO form_upl(title,file_name,file_type, total_attach,DATE_TIME,status)
            VALUES(<cfqueryparam value = "#form.title#" cfsqltype = "cf_sql_char"/>,<cfif Form.attachment1 NEQ ""><cfqueryparam value ='#cffile.ServerFile#' cfsqltype = "cf_sql_char"/>,</cfif><cfif Form.attachment NEQ ""><cfqueryparam value ='#file_type#' cfsqltype = "cf_sql_char"/><cfelse>'',</cfif><cfqueryparam value = "#form.totalAttachments#" cfsqltype = "cf_sql_char"/>,getdate(),'1')
        </cfquery>
    </cfif>
    <cfoutput>
        <cfscript>
            Application.fw_Notice("Document/Image Personal Particular is successfully insert into the system <br> press <a href=index.cfm?section=home&action=upload>| finish |</a>"); 
        </cfscript>
    </cfoutput>
</cfif>
<form action='#dir_path#upload.cfm?type=upload' method="POST" name="frmupload" align="right" enctype="multipart/form-data">
<cfif NOT isDefined ("form.submit_upload")>
            <table align="center">

                 <tr>
                    <td>TITLE : &nbsp;&nbsp;&nbsp; <input type="text" name="title" size="50" align="right"></td>
                </tr>
                <br>
                <tr>
                    <td>ATTACHMENT :  
                            <input type="file" name="attachment1" id="attachment1" onchange="document.getElementById('moreUploadsLink').style.display = 'inline';">&nbsp;&nbsp;&nbsp;<a href="..\setup\data\home\#qSelect.file_name#" target="_blank"></a>
                            <div id="moreUploads"></div>
                            <div id="moreUploadsLink" style="display:none;">
                            <a href="javascript:addFileInput();" style="color:#0000ad;">Attach another File</a></div>
                            <input type="hidden" name="totalAttachments" value="1">
                            <br><br>
                            <input type="submit" name="submit_upload" id="submit_upload" value="UPLOAD">

                    </td>
                </tr>
            </table>
            <p>&nbsp; </p>
</cfif>
</form>
<br><br>

what should I do for improving my code into my desire need??
Thanks.

[arrgh]

HTML file inputs do not allow multiple file selection. AFAIK you need flash, etc. Take a look at a control like swfupload
http://webdeveloperplus.com/jquery/multiple-file-upload-with-progress-bar-using-jquery/

[jackpoe72]

Use CFFILEUPLOAD. Much easier and works on all browsers. Make sure you specify securejson="false" in your cfapplication tag (application.cfm)

[jackpoe72]

upload the file into the database as a binary object and then pull it back out?

[arrgh]

Use CFFILEUPLOAD.

.. which IS flash :P But yep it's simpler if you're on CF9+