What is a form element in HTML?
<form> is a tag in HTML that has the special purpose of passing collected information from the user of the webpage to the backend database or servers. It includes other elements enclosed between its opening (<form>) and closing (</form>) tags.
Properties
Just like any other tag in HTML, a form is associated with a name and a value. The special attributes that it entertains are the method and action attributes.
- A
methodattribute specifies the type of request this form will process, e.g., aGETorPOSTmethod. - An
actionattribute specifies the path where the request is to be relayed.
A <form> may collect data using multiple elements that it supports. These elements are described in the table below.
Element | Description |
<button> | specifies a clickable button in the form |
<datalist> | specifies a drop-down menu |
<fieldset> | groups related elements and draws a box around them |
<input> | defines the location and medium of user input |
<keygen> | encrypts the data being forwarded to the server |
<label> | gives a boundary to the user interaction area |
<legend> | defines a caption for a fieldset |
<option> | specifies a selection list to choose from |
<output> | specifies a data output location |
<select> | specifies a drop-down list |
<textarea> | specifies a multi-line text box |
You can collect data using any of the elements in the aforementioned list according to your needs.
The data inside the form has an initial value, and the user may choose to change it and submit the form.
Code
In the example below, we will implement a simple form that inputs the username and password and allows us to choose between login and sign up.
Free Resources
