# RadioGroup (/docs/products/dash-dots/reference/components/radio-group)

Put a `Radio` inside it for each option.

**Children:** Components

## Example

![The RadioGroup component](/assets/images/dash-dots/components/radio-group.webp)

```xml title="view.dml"
<RadioGroup label="Pay with" value="{{ method }}" onChange="setMethod">
  <Radio value="mobile-money" label="Mobile money" />
  <Radio value="bank" label="Bank account" />
</RadioGroup>
```

```ts title="controller.ts"
export default definePage({
  initialState: { method: 'mobile-money' },
  mutations: {
    setMethod: (_state, event: ValueEvent) => ({ method: event.detail.value }),
  },
});
```

## Props

| Prop       | Type      | What it is                                              |
| ---------- | --------- | ------------------------------------------------------- |
| `value`    | `string`  | The chosen radio's `value`.                             |
| `label`    | `string`  |                                                         |
| `disabled` | `boolean` | Dims it, and the person can't use it. Default: `false`. |

## Events

| Event      | Sends                   | Notes                     |
| ---------- | ----------------------- | ------------------------- |
| `onChange` | `{ value }` in `detail` | The chosen radio's value. |