Merlin04
Merlin04

Reputation: 2327

Which has priority, the form tag an input is in or the form attribute of the input?

In this example:

<form id="form2"></form>
<form id="form1">
    <button type="submit" form="form2">Submit form</button>
</form>

Which form will the button belong to? Does the button tag being inside the form1 tag override the form attribute of the button, or is it the opposite?

Upvotes: 1

Views: 217

Answers (1)

alx
alx

Reputation: 2367

Careful experimentation shows that form attribute has priority, i.e. if you click the button form2 will be submitted.

Here is example fiddle: https://jsfiddle.net/jbxrwu0p/

Following code (from the fiddle) can demonstrate the effect:

<form action="https://www.ibm.com" id="form2"></form>
<form action="https://www.amd.com" id="form1">
    <button type="submit" form="form2">Submit form</button>
</form>

When you click button https://www.ibm.com is loaded.

Also, MDN says:

form The id of the of which the input is a member; if absent, the input is a member of the nearest containing form, or is not a member of a form at all

Upvotes: 1

Related Questions