CODEWITHSUNDEEP
coldfusion
Gosi
Gosi

Reputation: 2003

2 Submit buttons in 1 form

I have 2 submit buttons in my form.

<input type="submit" value="Save as Draft">
<input type="submit" value="Save">

Basically, what I want to do is when the user clicks on Save as Draft, it will proceed to bring all the form details to _update.cfm (without validating) and when the user clicks on Save, it will proceed to _validate.cfm and then to _update.cfm(validating and updating the database.)

HTML:

<cfset tx_name = "">

<cfif isDefined("form.tx_name")>
    <cfset tx_name = form.tx_name>
</cfif>

<cfinclude template="_validate.cfm">

<cfif isDefined("form.tx_name")>
    <cfinclude template="_update.cfm">
</cfif>

<form name="something">
    <input type="text" name="tx_name" value="#tx_name#">
    <input type="submit" value="Save as Draft">
    <input type="submit" value="Save">
</form>

So basically what the above form does is that, by default, tx_name = " " and when user types something and submits, it will do all the validation in _validate.cfm and then proceed to _update.cfm to update it.

This is the intended way to work when the user clicks on Save button. However, for Save as Draft, I would like it to skip the _validate.cfm and straight bring all the form field data to _update.cfm.

The following is what I tried:

Attempt 1:

Instead of having <input type="submit" value="Save as Draft">, I used <input type="button" value="Save as Draft" onClick="location.href='_update.cfm';". And this didn't bring the form fields to _update.cfm and I figured out the reason, its because it is just redirecting to _update.cfm upon clicking the button.

So this made me think that I really need a submit button (to bring form data to the _update.cfm page).

But here is where I am lost as I have now 2 submit buttons. 1 of it is to work with _validate.cfm and the other to work without _validate.cfm.

So how do I go about to make Save as Draft not validate but update and Save to validate and update?

Upvotes: 0

Views: 1076

Answers (3)

Jules
Jules

Reputation: 2021

I use a hidden form field called action. On the buttons I attach an onClick to change the value of action. On the form's action page I read that value and determine what to do. EX:

<input type="hidden" name="action" value="save" id="action"> 
<button type="submit" class="button button-basic-green" onclick="document.getElementById('action').value='save';"><span class="fa fa-save"></span> Save</button>
<button type="submit" class="button button-basic" onclick="document.getElementById('action').value='reload';"><span class="fa fa-repeat"></span> Save & Reload</button>
<button type="submit" class="button button-basic" onclick="document.location.href='./';return false;"><span class="fa fa-arrow-circle-o-left"></span> Cancel</button>

Upvotes: 2

James A Mohler
James A Mohler

Reputation: 11120

I would go down the road of both buttons having the same name, but a different value. I would also use button tags so that I could have better control over the display vs the value submitted. I would then not have to deal with if the display needs change, I would not have to change the processing. Last but not least I would wrap it so that it only operates in post

 <cfscript>
 if (cgi.request_method == "post") {

     if (form.keyexists("tx_name") tx_name = form.tx_name;

     if form.SaveMode == "Save")   include "_validate.cfm";

     if (form.keyexists("tx_name") include "_update.cfm";
     }
</cfscript>

 <form name="something" method="post">
     <input type="text" name="tx_name" value="#tx_name#">
     <button type="submit" name="SaveMode" value="Save as Draft">Save As Draft</button>
     <button type="submit" name="SaveMode" value="Save">Save</button>
 </form>

Upvotes: 3

Rajesh Manilal
Rajesh Manilal

Reputation: 1124

For that you have to add name for the two submit buttons. And using that name we can prevent the _validate.cfm inclusion, while submitting the form through clicking "Save as draft" button.

Also the form method should be POST, so that form scope will be available on action page, otherwise it'll available in URL scope.

<cfset tx_name = "">

<cfif isDefined("form.tx_name")>
    <cfset tx_name = form.tx_name>
</cfif>

<cfif isdefined("form.Save")>
    <cfinclude template="_validate.cfm">
</cfif>

<cfif isDefined("form.tx_name")>
    <cfinclude template="_update.cfm">
</cfif>

<form name="something" method="post">
    <input type="text" name="tx_name" value="#tx_name#">
    <input type="submit" name="SaveAsDraft" value="Save as Draft">
    <input type="submit" name="Save" value="Save">
</form>

Upvotes: 2

Related Questions