Solved

selecting multiple files in file upload Cold Fusion CFM page

Posted on 2014-02-05
17
986 Views
Last Modified: 2014-02-07
Upload MenuUpload WindowHi,

 I have file upload page (Coldfusion .CFM ) where I can select one file at the time and below is the code. The screenshot above is what pops up when I click [Browse] button from the menu.  Is there a way that I can select multiple files by using <Shift> or <Control> key or <Control>-<A>? When I tried them, none seem to work and I can only pick one file at a time.


[UPLOAD_PHOTO1.CFM ] -----------------------------------------------------------------------

      <form action="upload_photo2.cfm" method="POST" name="frmupload" enctype="multipart/form-data">
            <input type="file" name="file_path">
            <input type="submit" name="submit_upload" value="upload">
      </form>

[UPLOAD_PHOTO2.CFM ]  -----------------------------------------------------------------------
<cfif isdefined("form.submit_upload")>
<cffile action="UPLOAD" filefield="file_path" destination="d:\home\ABC.com\wwwroot\images" nameconflict="MAKEUNIQUE">File Uploaded Successfully!
</cfif>

            <CFFORM METHOD=POST ACTION="Upload_Photo1.cfm">
                  <INPUT TYPE="Submit" Value="Upload another Picture">
               </CFFORM>

            <CFFORM METHOD=POST ACTION="AdminMenu.cfm">
                  <INPUT TYPE="Submit" Value="Return to Main Menu">
               </CFFORM>


-----------------------------------------------------------------------
0
Comment
Question by:sglee
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 8
  • 7
  • 2
17 Comments
 
LVL 16

Accepted Solution

by:
Gurpreet Singh Randhawa earned 167 total points
ID: 39838382
ok, first what you want to use, cfflash format type cfmultipleupload functionality of coldfusion. Then let me know, i will share the code, if you are open to some jquery solution, here is very good article by @panosms for uploading multiple files:

Here is the Links:

my Artcle: http://randhawaworld.com/?p=152

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/Cold_Fusion_Markup_Language/A_11510-Image-ajax-upload-validate-rename-resize-using-Jquery-Coldfusion.html
0
 
LVL 52

Assisted Solution

by:_agx_
_agx_ earned 333 total points
ID: 39839498
Is there a way that I can select multiple files by using <Shift> or <Control> key or <Control>-<A>?

No, not with an HTML file control. HTML file inputs do not support multiple file selection. If you need that functionality you must use a signed control, such as flash, applet, etc.

These days, most browsers support flash/applets/etc... but not all of them.  So if browser support is an issue, you may want to stick with standard html controls.
0
 

Author Comment

by:sglee
ID: 39841893
File Upload 1File Upload 2File Upload 3@ myselfrandhawa
I found an article about CFFILEUPLOAD and created two following CFM Pages.

-------------------- SelectFiles.cfm --------------------------------------
<script>
    var foo = function(result)
    {
        alert(ColdFusion.JSON.encode(result));
    }
</script>
<cffileupload  
    url="uploadFiles.cfm"
    progressbar="true"
    name="myupload"
    addButtonLabel = "Add File"
    clearButtonlabel = "Clear it"
    hideUploadButton = "false"
    width=600
    height=400
    title = "File Upload"
    maxuploadsize="100"
    extensionfilter="*.jpg, *.png, *.flv, *.txt"
    BGCOLOR="##FFFFFF"
    MAXFILESELECT=100
    UPLOADBUTTONLABEL="Upload now"/>

</BODY>
------------------------ End of SelectFile.cfm ------------------------------------

--------------------- UploadFiles.cfm ------------------------
<cffile action="upload"
destination="d:\inetpub\wwwroot\ABC.COM\wwwroot\imageupload" nameconflict="makeunique"> <cfoutput>#serializeJSON({STATUS=200,MESSAGE='Passed'})#</cfoutput>
------------------------ End of UploadFiles.cfm ------------------------------------

As seen in above screenshots, I can select multiple files now (1st pic). That is good.
But when I click [Upload now], it seems to be uploading(2nd pic), but ends up in error
(3rd pic). And it never seem to execute "UploadFiles.cfm" page.

The original code of UploadFiles.cfm was as follows and I modified the destination.
<cffile action="upload" destination="#expandpath('./upload')#" nameconflict="makeunique"> <cfoutput>#serializeJSON({STATUS=200,MESSAGE='Passed'})#</cfoutput>
0
Instantly Create Instructional Tutorials

Contextual Guidance at the moment of need helps your employees adopt to new software or processes instantly. Boost knowledge retention and employee engagement step-by-step with one easy solution.

 
LVL 16

Expert Comment

by:Gurpreet Singh Randhawa
ID: 39841899
please make sure you have disabled the debugging while you use the cffileupload functionality
0
 

Author Comment

by:sglee
ID: 39841906
what do you mean by that?
0
 
LVL 52

Expert Comment

by:_agx_
ID: 39842103
He means debugging set in the CF Admin:
http://livedocs.adobe.com/coldfusion/8/htmldocs/help.html?content=Debug_02.html

When it's enabled it prints debug info at the bottom of every page. That can interfere with some operations. Either disable it in the CF Admin or use  <cfsetting showDebugOutput="false"> at the top of the script

http://help.adobe.com/en_US/ColdFusion/9.0/CFMLRef/WSc3ff6d0ea77859461172e0811cbec22c24-7d68.html
0
 

Author Comment

by:sglee
ID: 39842245
can you comment on my code in two CFM pages above as to why it fails?
0
 
LVL 52

Expert Comment

by:_agx_
ID: 39842292
I notice it says 500 error. That error should be recorded in more detail in the CF logs. What do the log files say?
0
 

Author Comment

by:sglee
ID: 39842316
I do not have access to the log file as the website is running on ISP Server.
0
 
LVL 52

Expert Comment

by:_agx_
ID: 39842353
(Edit) Debugging ajax is a bit tough under the best of circumstances. Doing it on a prod machine is even harder because you don't have access to any of the necessary debugging tools. You should test it on your local dev machine first. Then you can debug to your heart's content.  On the remote server, all you can do is add a try/catch to your upload script, and send error messages to a file and/or do the same in you Application.cfc onError method.
0
 

Author Comment

by:sglee
ID: 39842364
I asked ISP tech support about this problem and I am waiting to hear from them.
0
 
LVL 52

Expert Comment

by:_agx_
ID: 39842399
(Edit) Ok. They could at least verify those tags are enabled and working. In the mean time, why not try it on your dev machine? (I can't test it right now) Just to verify it's not a code problem.
0
 

Author Comment

by:sglee
ID: 39842458
I have CF V9 and I can install it to test.
0
 

Author Comment

by:sglee
ID: 39842660
Update: ISP tech support emailed me back saying it is fixed. There were two issues:
(1) They changed the destination in CFFILE statement:
to
"D:\home\ABC.com\wwwroot\imageupload"
from
"D:\inetpub\wwwroot\ABC.com\wwwroot\imageupload"

(2) my original uploadfiles.cfm page contained HTML code and they had to remove it. I don't understand why...
------------------------------ Original uploadfiles.cfm --------------------------------
<HTML>
<HEAD>
<TITLE></TITLE>
<META name="description" content="">
<META name="keywords" content="">
<META name="generator" content="CuteHTML">
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#800080">
<cffile action="UploadAll"
destination="d:\inetpub\wwwroot\ABC.com\wwwroot\imageupload" nameconflict="makeunique"> <cfoutput>#serializeJSON({STATUS=200,MESSAGE='Passed'})#</cfoutput>
</BODY>
</HTML>

------------------------------ Revised uploadfiles.cfm  --------------------------------
<cffile action="UploadAll"
destination="d:\inetpub\wwwroot\ABC.com\wwwroot\imageupload" nameconflict="makeunique"> <cfoutput>#serializeJSON({STATUS=200,MESSAGE='Passed'})#</cfoutput>
0
 
LVL 52

Assisted Solution

by:_agx_
_agx_ earned 333 total points
ID: 39842827
That makes sense. The calling page expects a valid JSON string - which you're producing by using serializeJSON (output)

This is valid JSON
{
    "STATUS": "200",
    "MESSAGE": "Passed"
}

Open in new window


But the extra HTML before and after it will cause an error because it breaks the JSON. You can test it out w/ http://jsonlint.com/

This won't validate because of the extra HTML
<HTML>
<HEAD>
<TITLE></TITLE>
<META name="description" content="">
<META name="keywords" content="">
<META name="generator" content="CuteHTML">
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#800080">
{
    "STATUS": "200",
    "MESSAGE": "Passed"
}
</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:sglee
ID: 39842984
Thank you for your help and I appreciate it.
0
 
LVL 52

Expert Comment

by:_agx_
ID: 39843127
Welcome. Glad you solved it!
0

Featured Post

Stressed Out?

Watch some penguins on the livecam!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Hi. There are several upload tutorials using jquery and coldfusion. I found a very interesting one here Upload Your Files using Jquery & ColdFusion and Preview them (http://www.randhawaworld.com/) . I did keep the main js functions but made sever…
I spent nearly three days trying to figure out how incorporate OAuth in Coldfusion for the Eventful API. Hopefully, this article will allow Coldfusion Programmers to buzz through the API when they need to. Basically, what this script does is authori…
The purpose of this video is to demonstrate how to manually back up a WordPress Database. This will be demonstrated using a Windows 8 PC. The Host used will be IPage.com Log into your Hosting account. IPage will be used for demonstration : Locat…
The purpose of this video is to demonstrate how to integrate Mailchimp with WordPress, by placing a Mailchimp signup form on a WordPress Page or Post. This will be demonstrated using a Windows 8 PC. Mailchimp will be used. Log into your Mailchi…

718 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question