AI Workshop: learn to build apps with AI →
Form fields: Radio buttons

Join the AI Workshop and learn to build real-world apps with AI. A hands-on, practical program to level up your skills.


Radio buttons are similar to checkboxes, but only one radio button can be active.

Selecting one deselects the other ones.

By setting one as checked, you make sure one is always selected.

<input type="radio" name="category" value="article" checked />
<input type="radio" name="category" value="tutorial" />
<input type="radio" name="category" value="news" />

Since only one is active at a time, in the POST request you’ll use the get() method of the FormData instance to retrieve the value selected.

Lessons in this unit:

0: Introduction
1: Form submit field
2: Specialized input fields
3: Checkboxes
4: ▶︎ Radio buttons
5: File input fields
6: Textarea
7: Select
8: Autocompleting form fields