splitforms.com
HTML · FORM CONTROL

HTML Button — submit, reset & button types (live demo)

The <button> element is a clickable control. Inside a form its type= attribute decides what it does: submit sends the form, reset clears it, and button does nothing on its own (use it for JavaScript). The default type is submit, which surprises people. Below is a working form whose submit button actually sends data.

Updated June 2026 · The <button> element · 12 elements in the reference

preview · html buttonsandboxed · no key
§ 01Copy-paste codeworking · submits to a free backend
button.html
<form action="https://splitforms.com/api/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">

  <label for="name">Name</label>
  <input type="text" id="name" name="name" required>

  <label for="email">Email</label>
  <input type="email" id="email" name="email" required>

  <!-- type="submit" is the default inside a form; shown for clarity -->
  <button type="submit">Send message</button>
  <button type="reset">Clear</button>
</form>

Replace YOUR_ACCESS_KEY with a key from your free splitforms dashboard. The form posts to one endpoint — submissions land in your inbox and dashboard with spam filtering built in.

§ 02<button> attributes
AttributeWhat it does
typesubmit (default — sends the form), reset (clears all fields), or button (no built-in behaviour — wire it to JavaScript).
nameSubmitted with the form when the button is the activator, along with its value.
valueThe value sent with the button's name when it triggers the submit.
disabledBoolean. Greys the button out and stops it from firing.
formactionOverrides the parent <form action> for this button only — handy for multiple submit targets.
formmethodOverrides the form's method (get/post) for this button.
§ 03Common mistakes
⚠ gotcha

Default type is submit

A <button> with no type inside a form submits the form. If you only want it to run JavaScript, set type="button" explicitly or it will reload the page.

⚠ gotcha

Content goes between the tags

Unlike <input type="submit" value="Send">, a <button> can contain HTML, icons, and styled text. Use value= on an <input>, but put visible content inside a <button>.

⚠ gotcha

IE sent the innerHTML

Old browsers submitted a button's text content instead of its value=. Modern browsers send value= correctly, but it's why some forms still use <input type="submit">.

§ 04Questions
What are the HTML button types?
There are three: type="submit" (the default inside a form, which sends it), type="reset" (clears all the form's fields), and type="button" (a plain clickable button with no built-in behaviour, used for JavaScript).
What is the button tag in HTML?
The <button> element is a clickable control. Inside a form it can submit or reset the form depending on its type= attribute; outside a form it's a general-purpose button you hook up with JavaScript.
How do I make a submit button in HTML?
Use <button type="submit">Send</button> inside a <form>. The button submits the form to its action URL. (type="submit" is the default inside a form, but stating it is clearer.)
What is the difference between <button> and <input type="submit">?
Both can submit a form. A <button> can contain rich HTML (icons, styled text) between its tags, while an <input> only shows its value= as plain text. Use <button> for anything styled.
Why does my button reload the page?
Because its type defaults to submit inside a form, so it submits and the page navigates. Add type="button" if you only want it to run a JavaScript handler.

Make this form actually submit.

Point your form at splitforms. 500 free submissions/month, spam filtering, webhooks — no server.

Get free access key →All HTML elements