In this section, we will learn what form attribute is and how it works.
What is form Attribute in HTML <button> Tag?
The form attribute is used to link a <form> element to the target <button> element.
Basically, in order to link an HTML <button> element to a form in order to use that button to submit the data of that form to the server, we have two choices:
- We can wrap the target <button> element in the body of the target <form> element.
- Or we can use the form attribute to link the target <button> element to the related form.
For the second method, the target <form> element needs to have an id attribute and the value of this attribute becomes the value of the form attribute of the <button> element. Using this method, there’s no need for the <button> element to be in the body of the <form> element anymore.
Note: make sure you set the `type` attribute of the target <button> element to “submit” as well. Otherwise, the button might not run as expected.
HTML form Attribute in <button> Tag Syntax:
<button form="form-id" type= "submit"> </button>
<button> Tag form Attribute Values
The value we set for the form attribute is the id value of the target <form> element.
Example: using form attribute in HTML <button> tag
See the Pen using form attribute in HTML <button> tag by Omid Dehghan (@odchan1) on CodePen.
