Most forms have a single submit button that will save the record when pressed.
Sometimes a form needs additional submit buttons like "accept" or "reject". Such buttons usually attempt a state transition while updating the record.
To process a form with multiple buttons, your server-side code will need to know which button was pressed. To do so you can give each submit button a different
[formaction]
Show archive.org snapshot
attribute. This will override the form's [action]
attribute and hence cause the browser to POST the form to another URL.
Example
Below is an example of a form for a "story". It has three submit buttons.
<form action="/storys/5">
<!-- form fields here -->
<button type="submit">Save changes</button>
<button type="submit" formaction="/deals/5/accept">Accept story</button>
<button type="submit" formaction="/deals/5/reject">Reject story</button>
</form>
Support
This [formaction]
attribute is
supported in all browsers
Show archive.org snapshot
.
Unpoly Show archive.org snapshot 's form submission supports it since version 2.0.
The primary submit action must be the first button
If you press enter on a field in a form it submits it using the first submit button in the form.
When your design want the default submit button to render somewhere else, it should still be the first button in the HTML source. You can use CSS (e.g. flex-direction
) to change the visual order without changing the order in the HTML markup.