A dropdown is a list in which the selected item is always visible while other items are visible on demand by clicking a dropdown button. Dropdowns are typically used for forms.
A dropdown is a list in which the selected item is always visible while other items are visible on demand by clicking a dropdown button. Dropdowns are typically used for forms.
<Dropdown ItemsSource=@items
Placeholder="Select an option"
OnChange=@UncontrolledSingleChangeHandler
Label=@($"Selected: {uncontrolledSingleSelectionResult?.Text}")
Style="width:300px;"
DropdownWidth="450"
DropdownHeight="150"
@ref=@dropDown1 />
<br />
<DefaultButton OnClick=ClickHandler>Clear!</DefaultButton>
<Label>Selected: @string.Join(", ", uncontrolledMultiSelectionResult.Select(x => x.Text))</Label>
<Dropdown ItemsSource=@items
MultiSelect="true"
Placeholder="Select options..."
OnChange=@UncontrolledMultiChangeHandler
Style="width:300px;" />
<Label>Selected: @(controlledSingleSelectionResult?.Text)</Label>
<Dropdown ItemsSource=@items
Placeholder="Select an option"
@bind-SelectedOption=@controlledSingleSelectionResult
Style="width:300px;" />
<Label>Selected: @string.Join(", ", controlledMultiSelectionResult!.Select(x => x.Text))</Label>
<Dropdown ItemsSource=@items
MultiSelect="true"
Placeholder="Select options..."
@bind-SelectedOptions=@controlledMultiSelectionResult
Style="width:300px;" />
<Dropdown ItemsSource=@items
Disabled="true"
Placeholder="Select an option"
Style="width:300px;" />
<Dropdown ItemsSource=@items
Disabled="true"
Placeholder="Select an option"
@bind-SelectedOption=@controlledSingleSelectionResult
Style="width:300px;" />
<EditForm Model="exampleModel" OnValidSubmit=@HandleValidSubmit>
<DataAnnotationsValidator />
<FluentUIValidationSummary />
<Dropdown ItemsSource=@items
Placeholder="Select an option"
@bind-SelectedOption=@(exampleModel.SelectionResult)
Style="width:300px;" />
<SubmitButton Text="Submit" />
</EditForm>