Radio Group

A group of radio buttons.

Requires JS

This component requires the radio_group stimulus controller.

Anatomy

RadioGroup do |r|
  r.item
  r.item
end

Name	Type	Default
`name:`	`string`	`nil`
`value:`	`string`	`nil`
`dir:`	`string`	`"ltr"`
`include_hidden:`	`boolean`	`true`
Whether to include a hidden input field for form submission.
`attributes`	`keyword arguments`

Builder method for generating multiple radio items from a collection.

Name	Type	Default
required `collection`	`array`
An array of objects or hashes for building radio items. Each item will generate a radio button with its associated label.
required `value_method:`	`symbol`
Method called on each collection item to get the radio button value. Used for form submission and selection logic.
required `text_method:`	`symbol`
Method called on each collection item to get the display text for the radio button label.
`container_class:`	`string`	`nil`
CSS classes for the container div wrapping each radio item and its label.
`disabled_items:`	`string` or `array`	`nil`
Values of radio items to disable. Can be a single value or array of values matching the value_method results.
`id_prefix:`	`string`	`nil`
String to prefix the auto-generated radio item IDs. If not provided, uses the name attribute as prefix.

Builder method for setting default attributes on radio item labels when using the items builder. Must be called before items method.

Name	Type	Default
`attributes`	`keyword arguments`
Attributes to apply to all radio item labels generated by the items builder method.

Builder method for setting default attributes on radio items when using the items builder. Must be called before items method.

Name	Type	Default
`attributes`	`keyword arguments`
Attributes to apply to all radio items generated by the items builder method.

Key	Description
Tab	Moves focus to either the checked radio item or the first radio item in the group.
Space	When focus is on an unchecked radio item, checks it.
ArrowDown	Moves focus and checks the next radio item in the group.
ArrowRight	Moves focus and checks the next radio item in the group.
ArrowUp	Moves focus and checks the previous radio item in the group.
ArrowLeft	Moves focus and checks the previous radio item in the group.

On This Page