Radio Buttons Fields

Radio buttons fields give you a group of radio (opens new window) inputs, and allow the author to select a single value (or provide a custom one, when allowed).

Screenshot of a radio buttons field interface in the Craft control panel

# Settings

In addition to the standard field options, radio buttons fields have the following settings:

Radio Button Options — Define the options that will be available to authors. Each option contains a Label (shown to the author) and a Value (saved to the database), as well as a checkbox indicating whether it should be selected by default.
Allow custom options — Whether authors can define an “other” option, on-the-fly.

# Development

# Querying Elements with Radio Buttons Fields

When querying for elements that have a radio buttons field, you can filter the results using a query param named after your field’s handle. Possible values include:

Value	Fetches elements…
`'foo'`	with the `foo` option selected (or a custom value of `foo`).
`'not foo'`	without the `foo` option selected (or a custom value of `foo`).
`['foo', 'bar']`	with either the `foo` or `bar` options selected (or a custom value of `foo`).
`['not', 'foo', 'bar']`	without either the `foo` or `bar` options selected (or a custom value of `foo`).

Twig
PHP

{# Fetch entries with the 'foo' option selected #}
{% set entries = craft.entries()
  .myRadioFieldHandle('foo')
  .all() %}

# Working with Radio Buttons Field Data

If you have an element with a radio buttons field in a template, you can access its data using the field’s handle:

Twig
PHP

{% set value = entry.myRadioFieldHandle %}

That will give you a craft\fields\data\SingleOptionFieldData (opens new window) object that contains information about the selected value and available options.

Outputting the object casts it to a string, which is equivalent to directly accessing its value (opens new window) property:

Twig
PHP

{{ entry.myRadioFieldHandle }} or {{ entry.myRadioFieldHandle.value }}

To check if any option is selected, you must test the value (opens new window) property, explicitly:

Twig
PHP

{% if entry.myRadioFieldHandle.value %}
  {# Yep, a value was selected! #}
{% endif %}

To show the selected option’s label, use the label (opens new window) property:

Twig
PHP

{{ entry.myRadioFieldHandle.label }}
{# "The selected option’s user-facing label!" #}

If the author provided a custom value, no label will be available.

To loop through all the available options, iterate over the options (opens new window) property. The selected option’s selected property will be true.

Twig
PHP

{% for option in entry.myRadioFieldHandle.options %}
  Label: {{ option.label }}
  Value: <code>{{ option.value }}</code>
  Selected: {{ option.selected ? 'Yes' : 'No' }}
{% endfor %}

If the author provides a “custom” value, no option will be marked as selected.

# Saving Radio Buttons Fields

In an element or entry form (opens new window) that needs to save a value to a radio buttons field, you can use this template as a starting point:

{% set field = craft.app.fields.getFieldByHandle('myRadioFieldHandle') %}

<ul>
  {% for option in field.options %}
    {% set selected = entry is defined
      ? entry.myRadioFieldHandle.value == option.value
      : option.default %}

    <li><label>
      <input type="radio"
        name="fields[myRadioFieldHandle]"
        value="{{ option.value }}"
        {% if selected %} checked{% endif %}>
      {{ option.label }}
    </label></li>
  {% endfor %}
</ul>