A checkbox input represents a box to check. Checkbox inputs can be
used by themselves or in groups. Checkbox inputs are best used with <label> tags.
| Type | Syntax | Description | Demo |
|---|---|---|---|
| checkbox | <input type="checkbox" name="signUp"/> |
A small box for marking form option as checked. |
Example
One checkbox. No value attribute is set, so the default value of on is submitted.
<label>crew<input type="checkbox" name="crewReady"/></label>
Submitted (if checked)
crewReady=on
Example
Multiple checkbox inputs. All with different name attributes.
<div>Activities</div>
<label>cooking<input type="checkbox" name="cooking"/></label>
<label>running<input type="checkbox" name="running"/></label>
<label>movies<input type="checkbox" name="movies"/></label>
Submitted (if cooking and movies are checked)
cooking=on&movies=on
Example
Multiple checkbox inputs with the SAME name attribute.
<div>Ingredients</div>
<label>Onion<input type="checkbox" name="ingredient" value="onion"/></label>
<label>Butter<input type="checkbox" name="ingredient" value="butter"/></label>
<label>Rice<input type="checkbox" name="ingredient" value="rice"/></label>
Submitted (if butter and rice are checked)
ingredient=butter&ingredient=rice
Question
What is the default value submitted for a <checkbox> when checked?