Tags | Element | Attribute | Name | Description |
---|---|---|---|---|
<form></form> | Form | Allows users to input information and sends it to an external source. | ||
action="[destination file]" | Action | Determines where the form's information goes. | ||
method="POST" method="GET" |
Method | "POST" is used to send data to a server to create/update a resource, whereas "GET" is used to request data from a specified resource. | ||
<input></input> | Input | Adds fields for users to input information. | ||
name="name" | Name | Assigns a name to an <input> element. | ||
value="value" | Value | This attribute is used with an <input> element for users to have a pre-filled text field when they first see the rendered form. | ||
type="text" | Type: text | Creates a single row field for text input. | ||
type="password" | Type: password | Creates a single row field that censors text input. | ||
type="number" | Type: number | Creates a single row field for number input. | ||
type="range" | Type: range | Creates a slider to select from a range of numbers. | ||
type="checkbox" | Type: checkbox | Creates a single checkbox which can be paired with other checkboxes. | ||
type="radio" | Type: radio | Creates a radio button that can be paired with other radio buttons. | ||
type="list" | Type: list | Will pair the <input> with <datalist> if the id of both are the same. | ||
type="submit" | Type: submit | Creates a submit button | ||
<select></select> | Select | It is populated with <option> elements and works with an <input> to search through choices. | ||
name="name" | Name | Assigns a name. Without the name the form won't work. | ||
id="id" | ID | Gives unique ID. | ||
<option></option> | Option | The <select> or <datalist> can have many <option>s, which either render a dropdown list for selection (in <select> element), or searches through choices (for <datalist> element). | ||
value="value" | Value | Assigns value to the <option>. | ||
<datalist></datalist> | Datalist | It is populated with <option> elements and works with an <input> to search through choices. | ||
<textarea><textarea> | Textarea | A text input field that has a customizable area. | ||
<label></label> | Label | Displays text that is written between the opening and closing tags. | ||
for="[<input>'s id]" | For | Assigns the <for> of the <label> element with the value of the id attribut of <input>. |