Using radio buttons

A radio button is one type of selection indicator in a list of options. If an option is selected, the circle is filled. If the option is not selected, the circle is empty. When one circle is selected, the others are deselected so that only one option may be selected at any time.

When you should use radio buttons

• When you need a user to select a singular option from a predefined list of option
• When there are less than 2 options for a user to select from

When you should avoid using radio buttons

• When you need a user to select more than one option from a predefined list of option, consider using checkboxes.
• When there are 2 or more options for a user to select from, consider using a dropdown.

---

Guidelines

Do:

• Clearly label each option
• Prioritize logical option order
• Display options vertically

Don't:

• Mix display options 

---

Adding radio buttons

To add radio buttons in a webform:

1. Navigate to Structure > Webforms > Forms and locate your webform by typing its name into the search.
2. Open your webform and navigate to Build > + Add element.
3. In the Select an element popup, select the Radios element.
4. Complete the form:
   • Element settings:
     • Title: The field label for the radio buttons.
   • Element options: 
   • Options: select predefined options or enter custom options.
     • Option value:  enter option value to store in data base.
     • Option text / description: enter option text or description you would like to show on the form.
     • Option display: select how you would like the options to show on the form 
     • Option description display: select from a description or help text to show on the form
   • Element description/help/more:
     • Description: The helper text that is shown underneath the title
   • Form validation:
     • Required: Whether or not the field is mandatory for the customer to complete 
     • Required message: The alert that is shown when a customer tries to complete the form without actioning

Need any more help?

If you have any questions, or require assistance with anything mentioned in this article, submit a request via the webform.