BlazorUI Demo

Select fields

Custom dropdowns for loaded items, enums and flags.

Searchable item select
Select
View code
<EditForm Model="model" FormName="select-items">
    <BuiSelect TItem="Country" TValue="int?" Items="countries" ValueSelector="x => x.Id" ToString="x => x.Name" Search="(item, text) => item.Name.Contains(text, StringComparison.OrdinalIgnoreCase)" @bind-Value="model.CountryId" Label="Country" />
</EditForm>

@code {
    private readonly Country[] countries = [new(1, "United Kingdom"), new(2, "Ireland"), new(3, "France")];
    private sealed record Country(int Id, string Name);
}
Enum and flags
Select
Read
View code
<EditForm Model="model" FormName="select-enums">
    <BuiEnumSelect TValue="Priority?" @bind-Value="model.Priority" Label="Priority" />
    <BuiFlagsSelect TValue="Permissions" @bind-Value="model.Permissions" Label="Permissions" />
</EditForm>

@code {
    private SelectModel model = new();
    private enum Priority { Low, Normal, High }
    [Flags] private enum Permissions { None = 0, Read = 1, Write = 2, Admin = 4 }
    private sealed class SelectModel { public int? CountryId { get; set; } public Priority? Priority { get; set; } public Permissions Permissions { get; set; } = Permissions.Read; }
}