- The purpose of a
<form> is to allow users to input information and send it.
- The
<form>‘s action attribute determines where the form’s information goes.
- The
<form>‘s method attribute determines how the information is sent and processed.
- To add fields for users to input information we use the
<input> element and set the type attribute to a field of our choosing:
- Setting type to "text" creates a single row field for text input.
- Setting type to "password" creates a single row field that censors text input.
- Setting type to "number" creates a single row field for number input.
- Setting type to "range" creates a slider to select from a range of numbers.
- Setting type to "checkbox" creates a single checkbox which can be paired with other checkboxes.
- Setting type to "radio" creates a radio button that can be paired with other radio buttons.
- Setting type to "list" will pair the
<input> with a <datalist> element if the id of both are the same.
- Setting type to "submit" creates a submit button.
- A
<select> element is populated with `' elements and renders a dropdown list selection.
- A
<datalist> element is populated with <option> elements and works with an <input> to search through choices.
- A
<textarea> element is a text input field that has a customizable area.
- When a
<form> is submitted, the name of the fields that accept input and the value of those fields are sent as name=value pairs.
