---

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 → action=save
• If “Publish” was clicked → 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.