A form lets visitors send information: a search term, a message, an order. The form element wraps the controls and describes where to send the data.
index.html
HTML
<form action="/subscribe" method="post">
<label for="email">Email address</label>
<input type="email" id="email" name="email">
<button type="submit">Subscribe</button>
</form>The important attributes
| Attribute | Meaning |
|---|---|
action | The address that receives the data |
method | How the data is sent: get or post |
GET or POST
- GET puts the data in the address bar, for example
search?q=poetry. Use it for searches and filters, where it is fine for people to bookmark or share the result. - POST sends the data in the body of the request. Use it for anything that changes something, or is private, such as a login or an order.
The name attribute
Each field needs a name. The name is the label the server uses for the value. A field without a name is not sent at all.
HTML sends, a server receives
HTML builds the form, but a server-side program (written in PHP, Python, Node.js or similar) or a form service must receive and handle the data. In the examples in this course the form does nothing when you press Submit, because there is no server to receive it.
warning
Forgetting name on fields
If a value is missing on the server, check that the field has a
name. The id is for labels and CSS. The name is for sending data.
info
Never trust form data
Anything a visitor sends can be wrong or malicious. Whatever receives the form must check and clean it. Validation in HTML, covered in Form Validation, helps users but is not a security measure.