Submit form using a button outside the <form> tag

Question

Say I have:

<form method="get" action="something.php">

    <input type="text" name="name" />

</form>

<input type="submit" />

How do I go about submitting that form with that submit button outside of the form, I think in HTML5 there's an action attribute for the submit but I'm not sure if that's fully cross-browser and if it isn't is there any way to do this?

Answer 1

In HTML, we can use form attribute for this. It requires having a visually hidden <submit> or <input type="submit"> element within the <form>, and an associated <label> element outside of it. It would look like this:

<form method="get" action="something.php">

     <input type="text" name="name" />

     <input type="submit" id="submit-form" class="hidden" />

</form>

<label for="submit-form" tabindex="0">Submit</label>

Now this link enables you to 'click' the form <submit> element by clicking the <label> element.

If you are interested to learn Web Development, then check out this Web Development Online Course by Intellipaat.