radio
A single radio for custom layouts. For a normal list use radio-group.
Example
Laravel
<x-admin::form-grid>
<x-admin::stack gap="2">
<x-admin::checkbox name="g_notify" label="Email owners when a run fails" checked />
<x-admin::switch name="g_live" label="Sync is live" checked />
<x-admin::radio name="g_single" value="a" label="A radio on its own" />
</x-admin::stack>
<x-admin::radio-group name="g_division" label="Division" value="pro" :options="['pro' => 'Professional', 'age' => 'Age group']" />
</x-admin::form-grid>Props
| Prop | Required | Default | Options |
|---|---|---|---|
name | null | ||
label | null | ||
id | null | ||
value | "1" | ||
checked | false |
Other attributes, such as wire:model or data-*, pass through to the element.
Other stacks
No React or Vue component. Use RadioGroup.
HTML, for any stack
<div class="adm-form-grid"><div class="adm-stack" style="gap:var(--ad-space-2)"><div class="adm-field">
<label class="adm-check">
<input type="checkbox" name="g_notify" id="g_notify" value="1" checked >
<span>Email owners when a run fails</span>
</label>
</div>
<div class="adm-field">
<input type="hidden" name="g_live" value="0"> <label class="adm-check">
<input type="checkbox" role="switch" class="adm-switch" name="g_live" id="g_live" value="1" checked >
<span>Sync is live</span>
</label>
</div>
<label class="adm-check">
<input type="radio" name="g_single" value="a" >
<span>A radio on its own</span>
</label></div>
<fieldset class="adm-fieldset">
<legend class="adm-label">Division</legend>
<div class="adm-radios">
<label class="adm-check">
<input type="radio" name="g_division" id="g_division_0" value="pro" checked >
<span>Professional</span>
</label>
<label class="adm-check">
<input type="radio" name="g_division" id="g_division_1" value="age" >
<span>Age group</span>
</label>
</div>
</fieldset></div>