Samuel Stiles
Samuel Stiles

Reputation: 2186

HTML form with multiple "actions"

I'm setting up a form wherein I need two "actions" (two buttons):

1 - "Submit this form for approval"
2 - "Save this application for later"

How do I create an HTML form that supports multiple "actions"?

EG:

<form class="form-horizontal" action="submit_for_approval.php">
<form class="form-horizontal" action="save_for_later.php">

I need to combine these two options-for-submitting into one form.

I did some basic research but couldn't find a definitive answer as to whether or not this is possible, and/or any good resources to links for a workaround.

Upvotes: 86

Views: 278271

Answers (5)

anderspitman
anderspitman

Reputation: 10510

This should work without changing the backend code:

<form class="form-horizontal" action="submit_for_approval.php">
  <button>Submit for Approval</button>
  <button formaction="save_for_later.php">Save for Later</button>
</form>

The accepted answer didn't work for me because I'm using Golang and apparently the default Go form parsing returns missing variables the same as empty ones (as empty strings). So you need to split it into separate endpoints.

Upvotes: 1

John Samuel
John Samuel

Reputation: 1

In front-end:

   <form action="act1.php" method="post">
   
   <!-- Your HTML Code -->
   
   <button type="submit" name="act" value="action1">Submit</button>
   <button type="submit" name="act" value="action2">Save for Later</button>
   </form>

In Backend: (act1.php)

<?php
if($_SERVER["REQUEST_METHOD"] == "POST") {
  $check = $_POST['act'];
  if($check == "action1") {

    /* Write the code of "submit_for_approval.php" Here or add the following line */
       header("Location: submit_for_approval.php");

  }

  
   if($check == "action2") {

    /* Write the code of "save_for_later.php" Here or add the following line */
       header("Location: save_for_later.php");

  }
}
?>

Upvotes: -1

Rj Acain
Rj Acain

Reputation: 1

this really worked form for I am making a table using thymeleaf and inside the table there is two buttons in one form...thanks man even this thread is old it still helps me alot!

<th:block th:each="infos : ${infos}">
<tr>
<form method="POST">
<td><input class="admin" type="text" name="firstName" id="firstName" th:value="${infos.firstName}"/></td>
<td><input class="admin" type="text" name="lastName" id="lastName" th:value="${infos.lastName}"/></td>
<td><input class="admin" type="email" name="email" id="email" th:value="${infos.email}"/></td>
<td><input class="admin" type="text" name="passWord" id="passWord" th:value="${infos.passWord}"/></td>
<td><input class="admin" type="date" name="birthDate" id="birthDate" th:value="${infos.birthDate}"/></td>
<td>
<select class="admin" name="gender" id="gender">
<option><label th:text="${infos.gender}"></label></option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</td>
<td><select class="admin" name="status" id="status">
<option><label th:text="${infos.status}"></label></option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
</td>
<td><select class="admin" name="ustatus" id="ustatus">
<option><label th:text="${infos.ustatus}"></label></option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
</td>
<td><select class="admin" name="type" id="type">
<option><label th:text="${infos.type}"></label></option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select></td>
<td><input class="register" id="mobileNumber" type="text" th:value="${infos.mobileNumber}" name="mobileNumber" onkeypress="return isNumberKey(event)" maxlength="11"/></td>
<td><input class="table" type="submit" id="submit" name="submit" value="Upd" Style="color: white; background-color:navy; border-color: black;" th:formaction="@{/updates}"/></td>
<td><input class="table" type="submit" id="submit" name="submit" value="Del" Style="color: white; background-color:navy; border-color: black;" th:formaction="@{/delete}"/></td>
</form>
</tr>
</th:block>

Upvotes: -1

the best way (for me) to make it it's the next infrastructure:

<form method="POST">
<input type="submit" formaction="default_url_when_press_enter" style="visibility: hidden; display: none;">
<!-- all your inputs -->
<input><input><input>
<!-- all your inputs -->
<button formaction="action1">Action1</button>
<button formaction="action2">Action2</button>
<input type="submit" value="Default Action">
</form>

with this structure you will send with enter a direction and the infinite possibilities for the rest of buttons.

Upvotes: 32

isaacparrot
isaacparrot

Reputation: 2053

As @AliK mentioned, this can be done easily by looking at the value of the submit buttons.

When you submit a form, unset variables will evaluate false. If you set both submit buttons to be part of the same form, you can just check and see which button has been set.

HTML:

<form action="handle_user.php" method="POST" />
  <input type="submit" value="Save" name="save" />
  <input type="submit" value="Submit for Approval" name="approve" />
</form>

PHP

if($_POST["save"]) {
  //User hit the save button, handle accordingly
}
//You can do an else, but I prefer a separate statement
if($_POST["approve"]) {
  //User hit the Submit for Approval button, handle accordingly
}

EDIT


If you'd rather not change your PHP setup, try this: http://pastebin.com/j0GUF7MV
This is the JavaScript method @AliK was reffering to.

Related:

Upvotes: 88

Related Questions