ComponentsInputs and forms
Select
A field that opens a list of known options, for one choice or several. Choose it over radios when there are more than five or six options or space is tight; switch to an autocomplete when the list is long enough to need searching.
Single choice
Bind Value to the chosen item. Each MudSelectItem carries a value; its child content is what the list shows.
Day pass on the Riverside line.
Every variant and margin
The same Variant and Margin as a text field, so selects line up with the inputs around them.
| Variant ↓ · Margin → | None | Dense | Normal |
|---|---|---|---|
| Text | |||
| Filled | |||
| Outlined |
Several choices
MultiSelection binds SelectedValues. SelectAll adds a toggle for the whole list, MultiSelectionTextFunc rewrites the summary, and chips let people remove a choice without reopening the list.
Objects and custom templates
Bind records directly: ToStringFunc gives the text shown in the field, and item content can be any markup. Records compare by value, so a fresh copy still selects the right item.
Island ferry
Ferry, line F2, every 45 minutes.
Clearable, dense and disabled options
Clearable returns the field to its empty value. Dense tightens the list; a disabled item explains itself instead of disappearing.
Playground
Change any parameter; the markup below updates with only the values that differ from the defaults.
<MudSelect
T="string"
@bind-Value="_line"
Label="Line"
Variant="Variant.Outlined">
@foreach (var line in _lines)
{
<MudSelectItem Value="line">@line</MudSelectItem>
}
</MudSelect>