0Pricing
HTML Academy · Lesson

Checkbox and Radio Button Groups

Let users pick one or many options from a group.

Checkboxes

Checkboxes let users select zero, one, or many options:

<label>
  <input type="checkbox" name="terms" value="agreed"> I agree to the Terms
</label>

<!-- Each checkbox is independent -->
<!-- checked attribute = pre-checked -->
<input type="checkbox" name="newsletter" value="yes" checked>

Checkbox Submission

Checkboxes only submit if checked:

<form>
  <input type="checkbox" name="hobby" value="reading"> Reading<br>
  <input type="checkbox" name="hobby" value="coding"> Coding<br>
  <input type="checkbox" name="hobby" value="gaming"> Gaming<br>
</form>
<!-- If reading and coding are checked:
     hobby=reading&hobby=coding -->
<!-- Unchecked boxes send nothing -->

All lessons in this course

  1. Select and option Dropdown Menus
  2. Textarea for Multi-line Input
  3. Checkbox and Radio Button Groups
  4. Datalist for Autocomplete
← Back to HTML Academy