A dropdown select component that allows users to choose one or multiple items from a popup list. RadzenDropDown supports data binding, filtering, templates, virtual scrolling, and both single and multiple selection modes. Binds to a data source via the Data property and uses TextProperty and ValueProperty to determine what to display and what value to bind. Supports filtering (with configurable operators and case sensitivity), custom item templates, empty state templates, value templates for the selected item display, and can be configured as editable to allow custom text entry. For multiple selection, set Multiple=true and bind to a collection type.
DropDownBase<TValue>.OnParametersSet
DropDownBase<TValue>.GetItemOrValueFromProperty
DropDownBase<TValue>.OnDataChanged
DropDownBase<TValue>.OpenPopupScript
DropDownBase<TValue>.OpenPopupScriptFromParent
DropDownBase<TValue>.OnFilterKeyPress
DropDownBase<TValue>.OnKeyPress
DropDownBase<TValue>.OnFilterInput
DropDownBase<TValue>.OnInitialized
DropDownBase<TValue>.OnParametersSetAsync
DropDownBase<TValue>.SelectItem
DropDownBase<TValue>.OnSelectAllKeyDown
DropDownBase<TValue>.SelectItemFromValue
DropDownBase<TValue>.VirtualizationOverscanCount
DropDownBase<TValue>.Virtualize
DropDownBase<TValue>.AllowVirtualization
DropDownBase<TValue>.HeaderTemplate
DropDownBase<TValue>.AllowFiltering
DropDownBase<TValue>.FilterAsYouType
DropDownBase<TValue>.AllowClear
DropDownBase<TValue>.ResetSelectedIndexOnFilter
DropDownBase<TValue>.AllowSelectAll
DropDownBase<TValue>.ValueProperty
DropDownBase<TValue>.DisabledProperty
DropDownBase<TValue>.RemoveChipTitle
DropDownBase<TValue>.ClearAriaLabel
DropDownBase<TValue>.SearchAriaLabel
DropDownBase<TValue>.EmptyAriaLabel
DropDownBase<TValue>.SelectedItemChanged
DropDownBase<TValue>.FilterDelay
DropDownBase<TValue>.SelectedItem
DropDownBase<TValue>.Separator
DropDownBase<TValue>.ItemComparer
DropDownBase<TValue>.selectedItems
DropDownBase<TValue>.selectedItem
DropDownBase<TValue>.selectedIndex
DropDownBase<TValue>.isPopupOpen
DropDownBase<TValue>.PreserveCollectionOnSelection
DataBoundFormComponent<TValue>.GetClassList
DataBoundFormComponent<TValue>.FocusAsync
DataBoundFormComponent<TValue>.OnContextMenu
DataBoundFormComponent<TValue>.TabIndex
DataBoundFormComponent<TValue>.FilterCaseSensitivity
DataBoundFormComponent<TValue>.FilterOperator
DataBoundFormComponent<TValue>.Name
DataBoundFormComponent<TValue>.Placeholder
DataBoundFormComponent<TValue>.Disabled
DataBoundFormComponent<TValue>.Change
DataBoundFormComponent<TValue>.LoadData
DataBoundFormComponent<TValue>.Form
DataBoundFormComponent<TValue>.Value
DataBoundFormComponent<TValue>.ValueChanged
DataBoundFormComponent<TValue>.IsBound
DataBoundFormComponent<TValue>.TextProperty
DataBoundFormComponent<TValue>.Query
DataBoundFormComponent<TValue>.SearchText
DataBoundFormComponent<TValue>.SearchTextChanged
DataBoundFormComponent<TValue>.EditContext
DataBoundFormComponent<TValue>.FieldIdentifier
DataBoundFormComponent<TValue>.ValueExpression
DataBoundFormComponent<TValue>.FormFieldContext
DataBoundFormComponent<TValue>.CurrentPlaceholder
DataBoundFormComponent<TValue>._view
RadzenComponent.RaiseContextMenu
RadzenComponent.RaiseMouseEnter
RadzenComponent.AddContextMenu
RadzenComponent.RaiseMouseLeave
RadzenComponent.OnBecameInvisible
RadzenComponent.DefaultCulture
RadzenComponent.IsJSRuntimeAvailable
ComponentBase.OnInitializedAsync
ComponentBase.StateHasChanged
ComponentBase.ShouldRender
ComponentBase.OnAfterRender
ComponentBase.InvokeAsync
ComponentBase.DispatchExceptionAsync
ComponentBase.RendererInfo
ComponentBase.Assets
ComponentBase.AssignedRenderMode
Namespace: Radzen.Blazor
Assembly: Radzen.Blazor.dll
public class RadzenDropDown<TValue> : DropDownBase<TValue>, IComponent, IHandleEvent, IHandleAfterRender, IRadzenFormComponent| Name | Description |
|---|---|
| TValue | The type of the selected value. Can be a primitive type, complex object, or collection for multiple selection. |
Basic dropdown with data binding:
<RadzenDropDown @bind-Value=@customerID TValue="string" Data=@customers TextProperty="CompanyName" ValueProperty="CustomerID" />
Dropdown with filtering and placeholder:
<RadzenDropDown @bind-Value=@selectedId TValue="int" Data=@items TextProperty="Name" ValueProperty="Id"
AllowFiltering="true" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" Placeholder="Select an item..." />
Multiple selection dropdown:
<RadzenDropDown @bind-Value=@selectedIds TValue="IEnumerable<int>" Data=@items Multiple="true" Chips="true" />A dropdown select component that allows users to choose one or multiple items from a popup list. RadzenDropDown supports data binding, filtering, templates, virtual scrolling, and both single and multiple selection modes. Binds to a data source via the Data property and uses TextProperty and ValueProperty to determine what to display and what value to bind. Supports filtering (with configurable operators and case sensitivity), custom item templates, empty state templates, value templates for the selected item display, and can be configured as editable to allow custom text entry. For multiple selection, set Multiple=true and bind to a collection type.
public RadzenDropDown<TValue>()Gets or sets whether selected items should be displayed as removable chips in the input area. When enabled in multiple selection mode, each selected item appears as a chip with an X button for quick removal. Requires Multiple to be set to true.
public bool Chips { get; set; }
| Type | Description |
|---|---|
| bool | Gets or sets whether selected items should be displayed as removable chips in the input area. When enabled in multiple selection mode, each selected item appears as a chip with an X button for quick removal. Requires Multiple to be set to true. |
Gets or sets whether the filter search text should be cleared after an item is selected. When true, selecting an item will reset the filter, showing all items again on the next open.
public bool ClearSearchAfterSelection { get; set; }
| Type | Description |
|---|---|
| bool | Gets or sets whether the filter search text should be cleared after an item is selected. When true, selecting an item will reset the filter, showing all items again on the next open. |
Callback for when a dropdown is closed.
public EventCallback Close { get; set; }
| Type | Description |
|---|---|
| EventCallback | Callback for when a dropdown is closed. |
Gets or sets the template displayed when the dropdown data source is empty or no items match the filter. Use this to show a custom "No items found" or "Empty list" message.
public RenderFragment EmptyTemplate { get; set; }
| Type | Description |
|---|---|
| RenderFragment | Gets or sets the template displayed when the dropdown data source is empty or no items match the filter. Use this to show a custom "No items found" or "Empty list" message. |
Gets or sets the HTML autocomplete attribute value for the filter search input. Controls whether the browser should provide autocomplete suggestions for the filter field.
public AutoCompleteType FilterAutoCompleteType { get; set; }
| Type | Description |
|---|---|
| AutoCompleteType | Gets or sets the HTML autocomplete attribute value for the filter search input. Controls whether the browser should provide autocomplete suggestions for the filter field. |
Gets or sets the placeholder text displayed in the filter search box within the dropdown popup. This helps users understand they can filter the list by typing.
public string FilterPlaceholder { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the placeholder text displayed in the filter search box within the dropdown popup. This helps users understand they can filter the list by typing. |
Gets or sets additional HTML attributes to be applied to the underlying input element. This allows passing custom attributes like data-* attributes, aria-* attributes, or other HTML attributes directly to the input.
public IReadOnlyDictionary<string, object> InputAttributes { get; set; }
| Type | Description |
|---|---|
| IReadOnlyDictionary<string, object> | Gets or sets additional HTML attributes to be applied to the underlying input element. This allows passing custom attributes like data-* attributes, aria-* attributes, or other HTML attributes directly to the input. |
Gets or sets a callback invoked when rendering each dropdown item. Use this to customize item attributes, such as adding CSS classes or data attributes based on item properties.
public Action<DropDownItemRenderEventArgs<TValue>> ItemRender { get; set; }
| Type | Description |
|---|---|
| Action<DropDownItemRenderEventArgs<TValue>> | Gets or sets a callback invoked when rendering each dropdown item. Use this to customize item attributes, such as adding CSS classes or data attributes based on item properties. |
Gets or sets the maximum number of selected item labels to display in the input before showing a count summary. When multiple selection is enabled and more items are selected than this value, the input will show "N items selected" instead of listing all labels. Only applicable when Multiple is true.
public int MaxSelectedLabels { get; set; }
| Type | Description |
|---|---|
| int | Gets or sets the maximum number of selected item labels to display in the input before showing a count summary. When multiple selection is enabled and more items are selected than this value, the input will show "N items selected" instead of listing all labels. Only applicable when Multiple is true. |
Callback for when a dropdown is opened.
public EventCallback Open { get; set; }
| Type | Description |
|---|---|
| EventCallback | Callback for when a dropdown is opened. |
Gets or sets whether the dropdown popup should automatically open when the input receives focus. Useful for improving user experience by reducing clicks needed to interact with the dropdown.
public bool OpenOnFocus { get; set; }
| Type | Description |
|---|---|
| bool | Gets or sets whether the dropdown popup should automatically open when the input receives focus. Useful for improving user experience by reducing clicks needed to interact with the dropdown. |
Gets or sets the keyboard key that triggers opening the popup when OpenOnFocus is enabled. Default is "Enter".
public string OpenPopupKey { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the keyboard key that triggers opening the popup when OpenOnFocus is enabled. Default is "Enter". |
Gets or sets the CSS style applied to the dropdown popup container. Use this to control the popup dimensions, especially max-height to limit scrollable area.
public string PopupStyle { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the CSS style applied to the dropdown popup container. Use this to control the popup dimensions, especially max-height to limit scrollable area. |
Gets or sets whether the dropdown is read-only and cannot be changed by user interaction. When true, the dropdown displays the selected value but prevents changing the selection.
public bool ReadOnly { get; set; }
| Type | Description |
|---|---|
| bool | Gets or sets whether the dropdown is read-only and cannot be changed by user interaction. When true, the dropdown displays the selected value but prevents changing the selection. |
Gets or sets the select all text.
public string SelectAllText { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the select all text. |
Gets or sets the selected items text.
public string SelectedItemsText { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the selected items text. |
Gets or sets the template used to render the currently selected value in the dropdown input. This allows custom formatting or layout for the displayed selection. The template receives the selected item as context.
public RenderFragment<object> ValueTemplate { get; set; }
| Type | Description |
|---|---|
| RenderFragment<object> | Gets or sets the template used to render the currently selected value in the dropdown input. This allows custom formatting or layout for the displayed selection. The template receives the selected item as context. |
protected override void BuildRenderTree(Rendering.RenderTreeBuilder __builder)
| Type | Name | Description |
|---|---|---|
| Rendering.RenderTreeBuilder | __builder |
protected override string GetComponentCssClass()
| Type | Description |
|---|---|
| string |
protected override Task HandleKeyPress(KeyboardEventArgs args, bool isFilter, bool? shouldSelectOnChange)
| Type | Name | Description |
|---|---|---|
| KeyboardEventArgs | args | |
| bool | isFilter | |
| bool? | shouldSelectOnChange |
| Type | Description |
|---|---|
| Task |
protected override Task OnAfterRenderAsync(bool firstRender)
| Type | Name | Description |
|---|---|---|
| bool | firstRender |
| Type | Description |
|---|---|
| Task |
Called when popup is closed.
public Task OnClose()
| Type | Description |
|---|---|
| Task |
Called when item is selected.
protected override Task OnSelectItem(object item, bool isFromKey)
| Type | Name | Description |
|---|---|---|
| object | item | The item. |
| bool | isFromKey | if set to true [is from key]. |
| Type | Description |
|---|---|
| Task |
Opens the popup.
protected override Task OpenPopup(string key, bool isFilter, bool isFromClick)
| Type | Name | Description |
|---|---|---|
| string | key | The key. |
| bool | isFilter | if set to true [is filter]. |
| bool | isFromClick | if set to true [is from click]. |
| Type | Description |
|---|---|
| Task |
public override Task SetParametersAsync(ParameterView parameters)
| Type | Name | Description |
|---|---|---|
| ParameterView | parameters |
| Type | Description |
|---|---|
| Task |