HTML select Tag form Attribute Tutorial

In this section, we will learn what the form attribute is and how to use it.

What is form Attribute in HTML <select> Tag?

For the majority of times, we put a <select> element in the body of a <form> element. So when users submit that form, the data of the target <select> element will be submitted to a server as well.

But that’s not always true! Sometimes we have a dropdown list outside of the body of a form!

Now in those cases, the value of that dropdown list won’t be submitted to a server because it is not linked to a form unless we use other programming languages like JavaScript to write a program that takes the value of the dropdown list and sends it to a server!

So in order to not involve another programming language and still be able to send the data of a dropdown list to a server, we can use the `form` attribute.

The form attribute basically links to another form in the same document, and when that form is submitted to a server, the data of the target <select> element will be submitted as well.

HTML form Attribute in <select> Tag Syntax:

<select name = “name” form = “form-id”> </select>

<select> Tag form Attribute Values

The value we set for the form attribute is the `id` value of the target form by which we want to submit the value of the <select> element.

For example, if the value of that form is set to “form1”, then the value of the `form` attribute would be “form1” as well.

Example: using form attribute in HTML <select> tag

See the Pen using form attribute in HTML <select> tag by Omid Dehghan (@odehghan) on CodePen.

Leave a Reply