Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Multiple submit buttons in an HTML form

People also ask

Can an HTML form have multiple submit buttons?

yes, multiple submit buttons can include in the html form. One simple example is given below.

Can I have two or more actions in the same form?

No, a form has only one action.

Can you have multiple submit buttons in a form MVC?

One Form can do a POST submission to one Action method in Controller and hence in order to use multiple Submit buttons inside one single Form, a Switch case has to be implemented inside the Action method.


I'm just doing the trick of floating the buttons to the right.

This way the Prev button is left of the Next button, but the Next comes first in the HTML structure:

.f {
  float: right;
}
.clr {
  clear: both;
}
<form action="action" method="get">
  <input type="text" name="abc">
  <div id="buttons">
    <input type="submit" class="f" name="next" value="Next">
    <input type="submit" class="f" name="prev" value="Prev">
    <div class="clr"></div><!-- This div prevents later elements from floating with the buttons. Keeps them 'inside' div#buttons -->
  </div>
</form>

Benefits over other suggestions: no JavaScript code, accessible, and both buttons remain type="submit".


Change the previous button type into a button like this:

<input type="button" name="prev" value="Previous Page" />

Now the Next button would be the default, plus you could also add the default attribute to it so that your browser will highlight it like so:

<input type="submit" name="next" value="Next Page" default />

Give your submit buttons the same name like this:

<input type="submit" name="submitButton" value="Previous Page" />
<input type="submit" name="submitButton" value="Next Page" />

When the user presses Enter and the request goes to the server, you can check the value for submitButton on your server-side code which contains a collection of form name/value pairs. For example, in ASP Classic:

If Request.Form("submitButton") = "Previous Page" Then
    ' Code for the previous page
ElseIf Request.Form("submitButton") = "Next Page" Then
    ' Code for the next page
End If

Reference: Using multiple submit buttons on a single form


If the fact that the first button is used by default is consistent across browsers, put them the right way around in the source code, and then use CSS to switch their apparent positions.

float them left and right to switch them around visually, for example.