2021-04-09 12:15:33 +00:00
|
|
|
# Radio Group
|
|
|
|
|
|
|
|
[component-header:sl-radio-group]
|
|
|
|
|
|
|
|
Radio Groups are used to group multiple radios so they function as a single control.
|
|
|
|
|
|
|
|
```html preview
|
|
|
|
<sl-radio-group label="Select an item">
|
|
|
|
<sl-radio value="1" checked>Item 1</sl-radio>
|
|
|
|
<sl-radio value="2">Item 2</sl-radio>
|
|
|
|
<sl-radio value="3">Item 3</sl-radio>
|
|
|
|
</sl-radio-group>
|
|
|
|
```
|
|
|
|
|
|
|
|
## Examples
|
|
|
|
|
2021-08-27 13:00:01 +00:00
|
|
|
### Showing the Fieldset
|
2021-04-09 12:15:33 +00:00
|
|
|
|
2021-08-27 13:00:01 +00:00
|
|
|
You can show a fieldset and legend that wraps the radio group using the `fieldset` attribute.
|
2021-04-09 12:15:33 +00:00
|
|
|
|
|
|
|
```html preview
|
2021-08-27 13:00:01 +00:00
|
|
|
<sl-radio-group label="Select an item" fieldset>
|
2021-04-09 12:15:33 +00:00
|
|
|
<sl-radio value="1" checked>Item 1</sl-radio>
|
|
|
|
<sl-radio value="2">Item 2</sl-radio>
|
|
|
|
<sl-radio value="3">Item 3</sl-radio>
|
|
|
|
</sl-radio-group>
|
|
|
|
```
|
|
|
|
|
|
|
|
[component-metadata:sl-radio-group]
|