Two Submit Buttons in One Form — How to Know Which Was Clicked
Detect which submit button was clicked in a form by giving buttons the same name with unique values, with server-side examples in PHP, Flask, Express, and Rails.
Introduction
Many web apps provide multiple submit actions within one form — think:
- Save
- Publish
- Delete
- Continue
- Submit & Next
The challenge:
When the form is submitted, how does your server know which button triggered the submission?
Luckily, HTML already solves this cleanly. You just need to use the right naming patterns.
The Correct HTML Pattern
Here’s the simplest and most universal approach:
<form method="post">
<input type="submit" name="action" value="save" />
<input type="submit" name="action" value="publish" />
</form>
When the user clicks one of the buttons, only that button’s name=value pair is included in the POST data.
Example POST data:
- If “Save” was clicked then
action=save - If “Publish” was clicked then
action=publish
This works in PHP, Python (Flask/Django), Node.js, Java, Ruby, Go, .NET, and more.
Serverside Examples
PHP
if ($_POST['action'] === 'save') {
// Save draft logic
}
if ($_POST['action'] === 'publish') {
// Publish logic
}
Python (Flask)
action = request.form.get("action")
if action == "save":
# save draft
elif action == "publish":
# publish
Node.js (Express)
const action = req.body.action;
if (action === "save") {
// save draft
}
if (action === "publish") {
// publish
}
Ruby on Rails
case params[:action]
when "save"
# save draft
when "publish"
# publish
end
Alternate Patterns
1. Using Different Names
<input type="submit" name="save_btn" value="Save">
<input type="submit" name="publish_btn" value="Publish">
Server-side, check which field is present.
2. Using <button> with inner text
<button type="submit" name="action" value="save">Save</button>
<button type="submit" name="action" value="publish">Publish</button>
3. Using FormData + JavaScript Custom Submission
Useful for advanced cases, like AJAX.
Common Mistakes to Avoid
- Using two submit buttons without names — the server won’t know which was clicked.
- Using JavaScript to guess the clicked button — unnecessary and brittle.
- Hoping the submit text (label) gets sent — it doesn’t.
Best Practice (TL;DR)
Always give submit buttons:
- the same
name - unique
value
Example:
<input type="submit" name="action" value="save">
<input type="submit" name="action" value="publish">
Done. Clean. Cross-platform. Works everywhere.
Conclusion
Handling multiple submit buttons is simple once you use HTML as intended. By giving each button the same name but different values (or unique names), the server will always know exactly which action the user triggered — without extra JavaScript or hacks.
This approach has been used reliably for more than 15 years and remains the cleanest solution today.