JavaScript and Form Radio Buttons
This part of the JavaScript and Forms Tutorial answers these common questions regarding JavaScript and form radio buttons:
- Is it better to use the onclick or onchange event for radio buttons?
- How do you get the value of the selected radio button in a group?
- How do you get the value of a radio button onclick?
- How do you select, deselect, or disable a radio button using JavaScript?
- How do you find out if the selected radio button is the one checked by default?
The pages listed above demonstrate, explain, and display the JavaScript.
Basic Facts about Radio Buttons
Radio buttons are set up in groups with each one having the same name as others in the group. Only one radio button in a group can be selected at a time. When another radio button in the group is clicked to select it, the previously selected one is deselected. Typical uses for radio buttons involve choices that are mutually exclusive, such as gender or shipping method.
When you use JavaScript to interact with radio buttons, you will most often be working with the checked
and value
properties. The onclick
event will generally be favored over onchange
. Find out why at Onclick vs. Onchange.