Submit a Form with a Button Outside the Form


How to submit a form with a submit button outside the form

You know, sometimes it's the little things that make you happy -- the super powers that you didn't know you had, when #usetheplatform comes through for you.

Submit Button Inside the Form

Most of the time, it's that familiar tale: the submit button is in the form:

<form>
  <input type="submit" value="Submit!" />
</form>

And when you click it, the form submits.

Submit Button Outside the Form

But sometimes, through a twist of fate, you must put your submit button outside the form. Well, you could concoct a JavaScript submission, JS WunderKind that you are. But, HTML can already supports this usecase for us.

Add an id to the form and point to it from the submit button:

<form id="theform">
</form>
<input form="theform" type="submit" value="Submit!" />

And it will STILL submit the form. Thank you, and good night.