From 273dd7eb33760ebac0699a39dede45b31269a20c Mon Sep 17 00:00:00 2001 From: Fritz Michael Gschwantner Date: Thu, 26 Feb 2026 17:14:03 +0100 Subject: [PATCH] Document Radio widget --- docs/dev/reference/widgets/radio.md | 74 +++++++++++++++++- .../images/dev/reference/widgets/radio.png | Bin 0 -> 8986 bytes 2 files changed, 72 insertions(+), 2 deletions(-) create mode 100644 page/assets/images/dev/reference/widgets/radio.png diff --git a/docs/dev/reference/widgets/radio.md b/docs/dev/reference/widgets/radio.md index c0d268415..780b69533 100644 --- a/docs/dev/reference/widgets/radio.md +++ b/docs/dev/reference/widgets/radio.md @@ -1,6 +1,76 @@ --- title: Radio -description: Renders a single or multiple radio buttons (not yet documented) +description: Renders a radio button selection. --- -{{< widget-notice >}} +This widget renders a radio button selection. + +![Radio buttons]({{% asset "images/dev/reference/widgets/radio.png" %}}?classes=shadow) + +## Options + +This table only shows the options relevant to the core functionality of this widget. See the DCA reference for a +[full field reference]({{% relref "fields" %}}). + +| Key | Value | Description +| ----- | ----- | --------------- | +| `inputType` | `select` | | +| `options` | `array` | An options array (use in combination with `eval.multiple`) | +| `options_callback` | `function\|callable` | A callback function that returns the options callback or an array (use in combination with `eval.multiple`). You may define an anonymous function, but you should consider [registering them via service tagging]({{% relref "reference/dca#registering-callbacks" %}}). | +| `reference` | `array` | Reference an array that will be used to translate the options. Contao will automatically match the options and reference array by key. | +| `foreignKey` | `string` | Reference another table to generate options from. | +| `eval.includeBlankOption` | true/false (default) `bool` | Includes a blank option (useful in conjunction with `mandatory` fields) | +| `eval.blankOptionLabel` | `string` (default `-`) | The label of the blank option | +| `eval.disabled` | true/false (default) `bool` | Disables the input field | + +## Examples + +{{< tabs groupid="radio-widget-examples" style="code" >}} + +{{% tab title="Simple radio buttons" %}} + +If you simply want to select an option from a fixed set. + +```php +// … +'example' => [ + 'label' => ['Example', 'Example radio buttons.'], + 'inputType' => 'radio', + 'options' => [ + 'lorem' => 'Lorem', + 'ipsum' => 'Ipsum', + 'dolor' => 'Dolor', + ], + 'sql' => [ + 'type' => 'string', + 'length' => 8, // Must be large enough to store all possible values + 'default' => 'lorem', + ], +], +// … +``` + +{{% /tab %}} + +{{% tab title="Options from a table" %}} + +You can generate an options array from another table with the `foreignKey` property. + +```php +// … +'example' => [ + 'label' => ['Example', 'Example radio buttons.'], + 'inputType' => 'radio', + 'foreignKey' => 'tl_user.name', // Will use `name` as label, and the user `id` as value + 'sql' => [ + 'type' => 'integer', + 'unsigned' => true, + 'default' => 0, + ], +], +// … +``` + +{{% /tab %}} + +{{< /tabs >}} diff --git a/page/assets/images/dev/reference/widgets/radio.png b/page/assets/images/dev/reference/widgets/radio.png new file mode 100644 index 0000000000000000000000000000000000000000..836ac83cb8d9940024799c549e7e9fdc7e714412 GIT binary patch literal 8986 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 literal 0 HcmV?d00001