Kies meerdere items uit een lijst, duidelijk gegroepeerd in een fieldset met legenda zodat schermlezers aankondigen waartoe de opties behoren.
Waarom het helpt
- Meerdere keuzes als één groep
- Toegankelijke groepering
- Afzonderlijke items kunnen worden uitgeschakeld
Waar het past
- Interesses en voorkeuren
- Machtigingen
- Filters
Voorbeeld
<CheckboxGroup TValue="string" Label="Notify me by" Items="_channels" @bind-Values="_selected" ShowSelectAll="true" ItemDisabled="@(channel => channel == "Phone")" HelperText="Phone is fixed by your administrator." />
<span>Selected: @(_selected.Count == 0 ? "none" : string.Join(", ", _selected))</span>
@code {
private readonly string[] _channels = { "Email", "SMS", "Push", "Phone" };
private IReadOnlyCollection<string> _selected = new[] { "Email" };
}Een kort fragment. Voeg @using RayCraft.Blazor.Components toe aan je pagina en gebruik een interactieve rendermodus.
Inbegrepen in RayCraft Free. Werkende voorbeelden staan in de GitHub-repository (MIT); het bevat voorbeeld- en democode, niet de code van de bibliotheek.