WEEK: 6

More form elements

Radio Button Video

What other items can you find in forms? I spoke of radio buttons and checkboxes in an earlier section. How would you implement a radio button list?
<input type="radio" name="color" value="blue">Blue<br>
<input type="radio" name="color" value="red">Red<br>
<input type="radio" name="color" value="green">Green<br>
<input type="radio" name="color" value="purple">Purple

Checkbox Video

Finally, let's look at checkboxes and the role they play in forms. They allow us to select multiple items in a list. We see these most often when a form asks us what our interests are. It may look something like this.

<h2>What kind of bikes do you like?</h2>
<input type="checkbox" name="mountain" value="mountain">Mountain<br>
<input type="checkbox" name="road" value="road">Road<br>
<input type="checkbox" name="cross" value="cross" checked>Cross<br>
<input type="checkbox" name="fattire" value="fattire" checked>Fat Tire<br>
<input type="checkbox" name="gravel" value="gravel" checked>Gravel<br>

See the Pen More Form Elements by Michael Cassens (@retrog4m3r) on CodePen.


Previous section:
Next section: