HTML button tag and what a form button sends

Why does a button submit my form when I did not ask it to?

You add a “Show tips” button to your contact form, wire it to a bit of JavaScript, and clicking it sends the half-written message. Or your “Save draft” button keeps getting used when people press Enter, and your inbox fills with drafts. Both come from browser defaults that the <button> tag has had for years.

We built 15 small forms, each testing one of those defaults, and ran them in Chromium 153, Firefox 155 and WebKit 26.6 against a local copy of Formgong's form backend. For each one we recorded whether a request left the page and exactly which button data was in it.

What do type submit, button and reset do?

The first row explains the “Show tips” bug. A <button> with no type is a submit button, so inside a form it sends the form. Formspree's HTML button guide lists button as the default type in its attribute list, then says a few paragraphs later that the default inside a form is submit. The second statement is the one that matched all three browsers. Write type on every button you add, so nobody reading your code has to remember.

The reset button did exactly what its name says and cleared what the visitor had typed, with no undo. It is rarely what anyone wants in a public form, because it sits next to Send and gets clicked by mistake.

What does a button inside a form send?

Only the button that submitted the form adds anything, and only if it has a name. Then it adds name=value, just like a field. With two buttons named intent, clicking Send gave intent=send and nothing from Save draft. That is a clean way to give one form two actions without JavaScript, and Formgong stored it as an ordinary answer, so intent: send showed up next to the message.

Enter is the surprise. When a visitor presses Enter in a text field, the browser acts as if they clicked the first submit button in the form, and in our test that sent intent=draft in all three browsers because Save draft came first in the markup. Put your main action first. If a form has no submit button at all, Enter still submits it when there is a single text field, and does nothing with two, which is why some search boxes work without a button and longer forms do not.

A few smaller details matter for the data. An <input type="submit"> sends its visible text as the value, so renaming the button on screen changes what your server receives. A named button with no value sends an empty answer. And a disabled submit button sends nothing, from a click or from Enter. If you send the form with fetch instead, new FormData(form) leaves the button out unless you pass it in, which our JavaScript FormData article measured.

Can one button send the form somewhere else?

Yes. Attributes on a submit button override the form's own for that click. A second button with formaction sent the same fields to a different address, and a third with formnovalidate skipped the browser's checks, so it went through with the required email still empty. That is how a “Save draft” button can save something incomplete. Our article on the form action attribute covers where those addresses can point. A button outside the form also works if you give it the form's id, as in form="f", which helps when a sticky footer holds the Send button.

What does a screen reader hear for a button?

Its text, if it has any. In Playwright's snapshot in all three browsers and in Chromium's own accessibility tree, “Send message” was read as a button named “Send message”, an <input type="submit"> with no value was named “Submit”, and an image button took its alt text. An icon-only button with just an SVG inside had no name at all, so a screen reader announces only “button”. Give those an aria-label; ours read as “Close”.

A disabled button is still listed, marked disabled, but Tab skips it in all three browsers. If you disable Send until the form is valid, keyboard and screen reader users cannot reach the button to find out why, so put the reason in text near it. A <div role="button"> got the right role and a name from its text, and that is all the markup gives it; everything else a button does is left to your script. The accessible contact form checklist has the rest of the button checks, including contrast.

What does a form backend do with the button?

Formgong, a form backend that sends each submission to your email or Telegram, treats a button's name=value like any other field and keeps it, which is what you want for an intent button and harmless otherwise. If you do not want the button in your emails, leave its name off. The markup below has the safe defaults: an explicit type on every button and the main action first.

The HTML form generator writes type="submit" on its button, and its optional script disables the button while the request runs and turns it back on when the answer comes, so a double click does not send twice. It is a small advantage. Static Forms' button tags guide, dated 25 June 2026, gives the same advice in prose: set the type every time, use name and value for intent, disable while a request is in flight. Formspree's button guide from 17 March 2025 mentions disabled for loading states in one line of its attribute list. So the advice is not new; the difference is only that our generator writes it for you. For the reload and second-tab cases a disabled button cannot stop, see our guide to stopping duplicate form submissions.

<form action="https://formgong.com/submit" method="POST">
  <input type="hidden" name="access_key" value="fk_your_access_key">
  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <!-- Not a submit button: say so, or it submits. -->
  <button type="button" id="tips">Show writing tips</button>

  <!-- The main action first: Enter in a field uses the first submit button. -->
  <button type="submit" name="intent" value="send">Send</button>
  <button type="submit" name="intent" value="draft" formnovalidate>Save draft</button>
</form>

Did a button behave differently for you?

If a button in your form submits, or fails to, in a way this test did not show, write to support@formgong.com. We will rerun your case in all three browsers and add it to the table.