Skip to main content
T
tburra
Participant
March 23, 2014
Answered

working with 2 submit buttons in a html form

  • March 23, 2014
  • 3 replies
  • 2346 views

I have 2 submit buttons in a form. I will upload a file and save in a filepath in server when I click on one "upload" button. I want to use this file path in the code when I click on another button called"Process".  When I click the process nothing is happening with dump in below code.Form  submits to itself. Is there any better way to do this. Thanks in advance.

<table width="40%" border="0" style="border: 1px solid black;">

          <form  name="uploadform" action="processfile.cfm" enctype="multipart/form-data"  method="post">

          <tr>

                    <td><input type="file"  name="FileContents" size="25">

                        <input type="button" name="action" id="action" value="Upload">

                    </td>

          </tr>

          <tr>

                    <td align="middle">

                              <input type="button" name="submitaction" id="process" value="Process">

                      </td>

          </tr>

          </form>

    </table>

<cfset variables.filepath ="">

<cfif isdefined("form.action") AND form.action eq "upload">

             <cffile action = "upload"  fileField = "FileContents" destination = "C:\test\" accept = "text/plain" nameConflict="overwrite">

          <cfset variables.filepath= "C:\test\#cffile.serverFile#">

<cfelseif isdefined("form.submitaction") AND form.submitaction eq "process">

          <cfdump var="#variables.filepath#">

</cfif>

    This topic has been closed for replies.
    Correct answer BKBK

    The elseif excludes the dump. In any case, it is unnecessary. You need not test for both form.submitaction and form.action, as they both either exist or not.

    You could just do something like

    <cfif isdefined("form.action") AND form.action eq "upload">

                 <cffile action = "upload"  fileField = "FileContents" destination = "C:\test\" accept = "text/plain" nameConflict="overwrite">

              <cfset variables.filepath= "C:\test\#cffile.serverFile#">

         <p> variables.filepath: <cfoutput>#variables.filepath#</cfoutput></p>

    </cfif>

    3 replies

    Anit_Kumar
    Anit_Kumar
    Inspiring
    March 24, 2014

    Hi tburra,

    You can try the below code. This dumps the value of the path as well.

    <cfif isDefined('Form.tmpfile1')> <cfset root = ExpandPath("/Upload")><!---location where file should be uploaded---> <cfset filename=GetFileFromPath(Form.tmpFile1)> <cfset FileExt=ListLast(filename,".")> <cfset variables.filepath =""> <cfset filename = "BidDocument1." & FileExt>  <cffile action="upload" filefield="BidDoc1" destination="C:\Upload\" nameconflict="overwrite" accept="application/pdf,application/msword,application/vnd.ms-excel,text/plain,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"> <cfset variables.filepath= "C:\test\#cffile.serverFile#"> <cfdump var="#variables.filepath#"> </cfif> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cffileupload Document</title> <form name="form1" enctype="multipart/form-data" method="post"> <input type="hidden" name="tmpfile1" value="" /> <input  type="file"  name="BidDoc1"  onchange="setFile(this.form);" /> <input type="submit" name="save1" value="Upload" /> </form> <button onclick="location.href='processfile.cfm'">Process</button> </html>

    This should help you.

    Regards,

    Anit Kumar

    T
    tburraAuthor
    Participant
    March 25, 2014

    Thank you  Anit. This is what I needed  but I used cflocation to process  my code in other coldfusion page. I used session scope to save the  filepath when I click  on  the upload button.  I made sessionfile path to empty in process page. It just worked like that. I renamed the upload button as upload& process. There is no issue if someone click on process button without clicking upload button. I greatly appreciate for the beautiful code.

    Carl Von Stetten
    Carl Von Stetten
    Legend
    March 24, 2014

    In addition to the input type="button" issue that Steve identified, I think you also might not understand the page request cycle properly.  Assuming both buttons were type="submit", when you click on the id="action" button, the form is submitted as a new request to the server.  The server processes the request and returns the result (which happens to be the same URL page in your case, but not necessarily the same content, as that depends on the logic of your .cfm page).  Then when you click on the id="process" button, an additional request to the server is made, and a new result is returned (again from the same URL page). So while each time the page being returned is the same URL as before, it is NOT the same exact page.

    When you click the id="action" button, ColdFusion processes the form submittal based on what you coded in the .cfm page.  It creates the variable variables.filepath as an empty string, then based on the <cfif> block it places the uploaded file in C:\test\ and sets variables.filepath to the full path of the file.  That variable only exists during the page request process - it is not persisted anywhere beyond that.  So when you click on the id="process" button and ColdFusion processes that new form request, once again variables.filepath is created and set to an empty string - and is never repopulated with the original file path (because in that request cycle, it was never generated from the file submission).

    -Carl V.

    T
    tburraAuthor
    Participant
    March 25, 2014

    Thanks Carl, That is awsome explanation. It was just empty  string at page reload and when I clicked on process button. When I click upload, it uploaded the file and assigned the filepath to variable. But If I click on the process button it was just empty string again. I tried with Varaiables scope,Session, request scope and hidden field. Nothing worked for me.

    BKBK
    Community Expert
    BKBKCommunity ExpertCorrect answer
    Community Expert
    March 24, 2014

    The elseif excludes the dump. In any case, it is unnecessary. You need not test for both form.submitaction and form.action, as they both either exist or not.

    You could just do something like

    <cfif isdefined("form.action") AND form.action eq "upload">

                 <cffile action = "upload"  fileField = "FileContents" destination = "C:\test\" accept = "text/plain" nameConflict="overwrite">

              <cfset variables.filepath= "C:\test\#cffile.serverFile#">

         <p> variables.filepath: <cfoutput>#variables.filepath#</cfoutput></p>

    </cfif>

    S
    Steve Sommers
    Legend
    March 24, 2014

    It might be because you are using type="button" instead of type="submit". W3C says:

    button = Defines a clickable button (mostly used with a JavaScript to activate a script)

    submit = Defines a submit button

    Because of the "mostly" reference, I don't rely on button=submit.

    BKBK
    Community Expert
    BKBKCommunity Expert
    Community Expert
    March 24, 2014

    Steve Sommers wrote:

    It might be because you are using type="button" instead of type="submit". W3C says:

    button = Defines a clickable button (mostly used with a JavaScript to activate a script)

    submit = Defines a submit button

    Because of the "mostly" reference, I don't rely on button=submit.

    I assumed there is, for example, Javascript to do the form submission. That is in view of the following:

    tburra wrote:

    Form submits to itself.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices