Forms Basics
Forms collect user input. Always pair every input with a label using matching for and id attributes. Use method='POST' for sensitive data and set action to the URL that processes the submitted form data.
HTML Forms <form action="/submit" method="POST">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<button type="submit">Submit</button>
</form>Always pair <label> with <input> using for and id.
Test your understanding before moving on
1. Which attribute associates a label with an input?
A. name
B. id paired with for
C. class
D. placeholder
💡 label for="id" links to input id="id" — clicking the label focuses the input.
2. What does the required attribute do?
A. Adds * symbol
B. Browser validates field is not empty before submit
C. Highlights field
D. Adds placeholder
💡 required prevents form submission if the field is empty.
3. method="POST" vs method="GET"?
A. No difference
B. GET shows data in URL; POST sends in request body
C. POST is faster
D. GET is more secure
💡 GET appends data to the URL; POST sends data in the body (more secure for sensitive data).
4. What does the action attribute specify?
A. Input type
B. Form method
C. URL to submit the form to
D. CSS class
💡 action="/url" specifies where the form data is sent when submitted.
5. What does novalidate do on a form?
A. Disables JavaScript
B. Disables HTML5 built-in validation
C. Removes submit button
D. Makes fields optional
💡 novalidate disables browser built-in validation so you can use custom JavaScript validation.