Apostrophe 3 Documentation

# radio

A radio field allows a list of options where a user can select one value.

# Module field definition

// Configuring the `animalType` field in a module's `fields.add` subsection:
animalType: {
  label: 'Type of animal',
  type: 'radio',
  choices: [
    {
      label: 'Mammals 🦧',
      value: 'mammals'
    },
    {
      label: 'Fish 🐠',
      value: 'fish'
    },
    {
      label: 'Birds 🦜',
      value: 'birds'
    },
    {
      label: 'Reptiles 🦎',
      value: 'reptiles'
    },
    {
      label: 'Amphibians 🐸',
      value: 'amphibians'
    }
 ]
}

# Settings

# Required

Property Type Default Description
choices array n/a An array of options that the editor can select from. See below.
label String n/a Sets the visible label for the field in the UI
type String n/a Specifies the field type (radio for this type)

# Optional

Property Type Default Description
def Varies n/a The default value for the field. Must be from the defined choices' values.
help String n/a Help text for the content editor
htmlHelp String n/a Help text with support for HTML markup
if Object {} Conditions to meet before the field is active. See the guide for details.
required Boolean false If true, the field is mandatory

# choices configuration

The choices setting in checkboxes, radio, or select fields configures the options that a user will see in the interface and the values that the server will allow in validation. The choices value is an array of objects with label and value properties.

  • value is used in the field's database value
  • label is the more human-readable version used in interfaces

# Use in templates

Radio field data is stored as the string value property of the selected choice.

{{ data.piece.animalType }}

← range →