Class SfDropDownList<TValue, TItem>

The DropDownList component allows users to select a single value that is non-editable from a list of predefined values.

Inheritance

System.Object

SfBaseComponent

SfDataBoundComponent

SfDropDownBase<TItem>

SfDropDownList<TValue, TItem>

SfComboBox<TValue, TItem>

Inherited Members

SfDropDownBase<TItem>.reflectionHelper

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.Render(System.Collections.Generic.IEnumerable<TItem>, Syncfusion.Blazor.DropDowns.FieldSettingsModel, Syncfusion.Blazor.Data.Query)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.SetListData(System.Collections.Generic.IEnumerable<TItem>, Syncfusion.Blazor.DropDowns.FieldSettingsModel, Syncfusion.Blazor.Data.Query)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ActionBegin(System.Collections.Generic.IEnumerable<TItem>, Syncfusion.Blazor.Data.Query)

SfDropDownBase<TItem>.ActionComplete(IEnumerable<TItem>, Query)

SfDropDownBase<TItem>.ActionFailure(Object)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.GetQuery(Syncfusion.Blazor.Data.Query)

SfDropDownBase<TItem>.SetFields()

SfDropDownBase<TItem>.SimpleDataExecute(IEnumerable<TItem>, Query)

SfDropDownBase<TItem>.CloneQuery(Query)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.OnInitializedAsync()

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.OnParametersSetAsync()

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.GetDataByText(System.String, System.String)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.IncrementalSearch(System.String, System.Collections.Generic.IEnumerable<TItem>, System.Nullable<System.Int32>, System.Boolean)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.Search(System.String, System.Collections.Generic.IEnumerable<TItem>, System.String, System.Boolean)

SfDropDownBase<TItem>.SetItemValue(String, Type)

SfDropDownBase<TItem>.IsSimpleDataType()

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.AddItems(System.Collections.Generic.IEnumerable<TItem>, System.Nullable<System.Int32>)

SfDropDownBase<TItem>.AddItemsAsync(IEnumerable<TItem>, Nullable<Int32>)

SfDropDownBase<TItem>.InsertItem(IEnumerable<TItem>, Nullable<Int32>, Boolean)

SfDropDownBase<TItem>.IsFilter()

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.RenderItems()

SfDropDownBase<TItem>.GetGroupedDataSource(IEnumerable<TItem>, SortOrder)

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.HighlightSearch(System.String, System.String, System.Boolean, Syncfusion.Blazor.DropDowns.FilterType)

SfDropDownBase<TItem>.ListItemCreated(ListOptions<TItem>)

SfDropDownBase<TItem>.Dispose(Boolean)

SfDropDownBase<TItem>.ItemTemplate

SfDropDownBase<TItem>.GroupTemplate

SfDropDownBase<TItem>.NoRecordsTemplate

SfDropDownBase<TItem>.ActionFailureTemplate

SfDropDownBase<TItem>.SortOrder

SfDropDownBase<TItem>.DataSource

SfDropDownBase<TItem>.Query

SfDropDownBase<TItem>.DuplicateQuery

SfDropDownBase<TItem>.FilterType

SfDropDownBase<TItem>.IgnoreCase

SfDropDownBase<TItem>.IgnoreAccent

SfDropDownBase<TItem>.ZIndex

SfDropDownBase<TItem>.DropDownsEditContext

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ListData

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.MainData

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ListDataSource

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.DataId

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ItemData

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.IsActionFaiure

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.TotalCount

Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ComponentName

SfDataBoundComponent.SetDataManager<T>(Object)

SfDataBoundComponent.OnAfterRenderAsync(Boolean)

SfDataBoundComponent.DataManager

SfDataBoundComponent.MainParent

SfBaseComponent.Dispose()

SfBaseComponent.OnObservableChange(String, Object, Boolean, NotifyCollectionChangedEventArgs)

Namespace: Syncfusion.Blazor.DropDowns

Assembly: Syncfusion.Blazor.dll

Syntax

public class SfDropDownList<TValue, TItem> : SfDropDownBase<TItem>, IInputBase, IDropDowns

Type Parameters

Name	Description
TValue	Specifies the value type.
TItem	Specifies the type of SfDropDownList.

Examples

In the following code example, a basic DropDownList component is initialized with simple list items.

<SfDropDownList TItem="string" TValue="string" DataSource="@MyList">
</SfDropDownList>
@code{
    protected List<string> MyList = new List<string>() { "Small", "Medium", "Large" };
}

Constructors

SfDropDownList()

Declaration

public SfDropDownList()

Fields

ARIA_HAS_POPUP

specifies the aria-has-popup class.

Declaration

protected const string ARIA_HAS_POPUP = "aria-haspopup"

Field Value

Type	Description
System.String

ASSERTIVE

specifies the assertive string.

Declaration

protected const string ASSERTIVE = "assertive"

Field Value

Type	Description
System.String

FALSE

Specifies the string false.

Declaration

protected const string FALSE = "false"

Field Value

Type	Description
System.String

NO_DATA

Specifies the root class of base component.

Declaration

protected const string NO_DATA = "e-content e-dropdownbase e-nodata"

Field Value

Type	Description
System.String

TRUE

Specifies the string true.

Declaration

protected const string TRUE = "true"

Field Value

Type	Description
System.String

Properties

AllowFiltering

Gets or sets a value that indicates whether the filtering option is enabled or not.

Declaration

public bool AllowFiltering { get; set; }

Property Value

Type	Description
System.Boolean	true, if the filtering option is enabled and show the filter bar (search box) in the pop-up; otherwise, false.The default value is false.

Remarks

The filter action retrieves the matched items using the Filtering event based on the characters typed in the search textbox.

CssClass

Gets or sets a CSS class string to customize the appearance of the DropDownListEvents<TValue, TItem> component.

Declaration

public string CssClass { get; set; }

Property Value

Type	Description
System.String	Accepts a CSS class string separated by space to customize the appearance. The default value is String.Empty.

Enabled

Gets or sets a value that indicates whether to enable or disable the DropDownListEvents<TValue, TItem> component.

Declaration

public bool Enabled { get; set; }

Property Value

Type	Description
System.Boolean	true, if the Dropdown list component is enabled; otherwise, it is disabled. The default value is false.

EnablePersistence

Gets or sets whether to persist component's state between page reloads. When set to true, the Value property is persisted.

Declaration

public bool EnablePersistence { get; set; }

Property Value

Type	Description
System.Boolean	true, if the component's state persistence is enabled. The default value is false.

Remarks

Component's Value property will be stored in browser local storage to persist component's state when page reloads.

EnableRtl

Gets or sets whether the right-to-left direction is enabled or not for the drop-down list component.

Declaration

public bool EnableRtl { get; set; }

Property Value

Type	Description
System.Boolean	true, if the right to left direction is enabled for dropdown list component. The default value is false.

EnableVirtualization

Gets or sets a value indicating whether the virtual scrolling is enabled or not.

Declaration

public bool EnableVirtualization { get; set; }

Property Value

Type	Description
System.Boolean	true if the virtual scrolling for dropdown list; otherwise, false. The default is false.

Remarks

To improve performance, the EnableVirtualization property is set to true.

FilterBarPlaceholder

Gets or sets the text that is displayed when the filter textbox has no text and removes the focus.

Declaration

public string FilterBarPlaceholder { get; set; }

Property Value

Type	Description
System.String	The text that is displayed when the filter text box has no text. The default value is String.Empty.

Remarks

This property value is updated only when the AllowFiltering is enabled.

FloatLabelType

Gets or sets the floating label behavior of the dropdown list. The Placeholder text act as a lable.

Declaration

public FloatLabelType FloatLabelType { get; set; }

Property Value

Type	Description
FloatLabelType	One of the FloatLabelType enumeration. The default value is Never

Remarks

If the FloatLabelType is Never, the placeholder text does not float as a label. If the FloatLabelType is Auto, the placeholder text will float above the DropDownList component as a label after focusing it. If the FloatLabelType is Always, the placeholder text is displayed as a label above the DropDownList component.

Examples

In the following code example, set the float lable as Auto.

<SfDropDownList TItem="string" TValue="string" DataSource="@MyList" Placeholder="Select a value" FloatLabelType="FloatLabelType.Auto">
</SfDropDownList>
@code{
    protected List<string> MyList = new List<string>() { "Small", "Medium", "Large" };
}

FooterTemplate

Gets or sets the customised design content and assigns it to the footer container of the pop-up list.

Declaration

public RenderFragment FooterTemplate { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.RenderFragment	The template content. The default value in null.

Examples

<SfDropDownList TItem="string" TValue="string" DataSource="@MyList">
    <DropDownListTemplates TItem="string">
        <FooterTemplate>
            <span class='footer'>Total list items: 3 </span>
        </FooterTemplate>
    </DropDownListTemplates>
</SfDropDownList>
@code{
    protected List<string> MyList = new List<string>() { "Small", "Medium", "Large" };
}

HeaderTemplate

Gets or sets the customised design content and assigns it to the header container of the popup list.

Declaration

public RenderFragment HeaderTemplate { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.RenderFragment	The template content. The default value in null.

Examples

<SfDropDownList TItem="string" TValue="string" DataSource="@MyList">
    <DropDownListTemplates TItem="string">
        <HeaderTemplate>
            <span class='header'> T-shirt size </span>
        </HeaderTemplate>
    </DropDownListTemplates>
</SfDropDownList>
@code{
    protected List<string> MyList = new List<string>() { "Small", "Medium", "Large" };
}

HtmlAttributes

Gets or sets a collection of additional attributes such as styles, class, and more that will be applied to the dropdown list element.

Declaration

public Dictionary<string, object> HtmlAttributes { get; set; }

Property Value

Type	Description
System.Collections.Generic.Dictionary<System.String, System.Object>	The value as dictionary collection.The default value is null

Remarks

Additional attributes can be added by specifying as inline attributes or by specifying @attributes directive.

Examples

<SfDropDownList TItem="string" TValue="string" DataSource="@MyList" HtmlAttributes="@CustomAttribute">
</SfDropDownList>
@code{
    protected List<string> MyList = new List<string>() { "Small", "Medium", "Large" };
    Dictionary<string, object> CustomAttribute = new Dictionary<string, object>()
    {
        { "title", "Select T-shirt size" }
    }
}

ID

Gets or sets the unique identifier for DropDownListEvents<TValue, TItem> component.

Declaration

public string ID { get; set; }

Property Value

Type	Description
System.String	Accepts a string value. The default value is String.Empty.

Remarks

You can specify only unique value.

Index

Gets or sets the index of the selected item in the dropdown list component.

Declaration

public Nullable<int> Index { get; set; }

Property Value

Type	Description
System.Nullable<System.Int32>	The index of the selected items in the list. The default value is null which indicates that nothing is selected.

Remarks

Use this property to determine the index of the currently selected item in the list if the dropdown list component allows only one selection.

Exceptions

Type	Condition
System.ArgumentOutOfRangeException	The index was set to less than -1, or greater than or equal to the number of items on the list at the time the list is rendered.

IndexChanged

Gets or sets the callback to trigger when the index changes.

Declaration

public EventCallback<Nullable<int>> IndexChanged { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<System.Nullable<System.Int32>>

InputAttributes

Gets or sets a collection of additional attributes such as disabled, value, and more that will be applied to the dropdown list input element.

Declaration

public Dictionary<string, object> InputAttributes { get; set; }

Property Value

Type	Description
System.Collections.Generic.Dictionary<System.String, System.Object>	The value as dictionary collection. The default value is null

Remarks

If you configured both the property and equivalent input attribute, then the component considers the property value.

ItemsCount

Gets or sets the number of items to be fetched in the popup when the EnableVirtualization property is enabled.

Declaration

public int ItemsCount { get; set; }

Property Value

Type	Description
System.Int32	The number of list items to be fetched in dropdown list component. The default value is 5.

Placeholder

Gets or sets the text that is displayed when the dropdown list has no value and remove on the focus.

Declaration

public string Placeholder { get; set; }

Property Value

Type	Description
System.String	The text that is displayed when the dropdown list has no value. The default value is String.Empty.

Remarks

The property depends on the FloatLabelType property, The placeholder text acts as a label.

PopupHeight

Gets or sets the height of the popup list.

Declaration

public string PopupHeight { get; set; }

Property Value

Type	Description
System.String	The preferred height of the popup list in pixels or percentage of the dropdown list. The default value is 300px.

Remarks

This property accepts pixels or percentage value.

PopupWidth

Gets or sets the width of the popup list. By default, the popup width sets based on the width of the SfDropDownList<TValue, TItem> component.

Declaration

public string PopupWidth { get; set; }

Property Value

Type	Description
System.String	The preferred width of the popup list in pixels or percentage of the dropdown list. The default value is 100%.

Remarks

This property accepts pixels or percentage value.

Readonly

Gets or sets a value indicating whether the SfDropDownList<TValue, TItem> is in read-only mode or not.

Declaration

public bool Readonly { get; set; }

Property Value

Type	Description
System.Boolean	true if the dropdown list is in read-only mode; otherwise, false. The default is false.

Remarks

In read-only mode, the dropdown list popup can not be opened on click.

ShowClearButton

Gets or sets a value indicating whether to show or hide the clear button in the dropdown list. It helps to clear the selected value of a dropdown list on user intraction.

Declaration

public virtual bool ShowClearButton { get; set; }

Property Value

Type	Description
System.Boolean	true if show the clear button in the dropdown list; otherwise, false. The default is false.

Remarks

When the clear button is clicked, Value, and Index properties are reset to null.

TabIndex

Gets or sets the location of the SfDropDownList<TValue, TItem> component in the tab order.

Declaration

public int TabIndex { get; set; }

Property Value

Type	Description
System.Int32	The numeric index of the dropdown list in the tab order. The default value is 0.

Value

Gets the value of the selected item in the dropdown list component. This will be used with two-way binding.

Declaration

public TValue Value { get; set; }

Property Value

Type	Description
TValue	The value of the selected item in the dropdown list component. The default is null.

Remarks

Use the Value property to specify or determine the value displayed in the SfDropDownList<TValue, TItem> component.

ValueChanged

Gets or sets a callback that trigger when the value changes.

Declaration

public EventCallback<TValue> ValueChanged { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TValue>

ValueExpression

Gets or sets an expression that identifies the bound value in the DropDownListEvents<TValue, TItem> component.

Declaration

public Expression<Func<TValue>> ValueExpression { get; set; }

Property Value

Type	Description
System.Linq.Expressions.Expression<System.Func<TValue>>

ValueTemplate

Gets or sets the customised design content and assigns it to the selected list item in the input element of the component.

Declaration

public RenderFragment<TItem> ValueTemplate { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.RenderFragment<TItem>	The template content. The default value in null.

Examples

<SfDropDownList TItem="string" TValue="string" DataSource="@MyList">
    <DropDownListTemplates TItem="string">
        <ValueTemplate>
            <span> T-shirt size - @(context)</span>
        </ValueTemplate>
    </DropDownListTemplates>
</SfDropDownList>
@code{
    protected List<string> MyList = new List<string>() { "Small", "Medium", "Large" };
}

Width

Gets or sets the width of the SfDropDownList<TValue, TItem> component.

Declaration

public string Width { get; set; }

Property Value

Type	Description
System.String	The preferred width of the dropdown list in pixels or percentage value. The default value is 100%.

Methods

BuildRenderTree(RenderTreeBuilder)

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder	__builder

ClearAll(EventArgs)

Task which used to clear all the items.

Declaration

protected virtual Task ClearAll(EventArgs args = null)

Parameters

Type	Name	Description
System.EventArgs	args	Specifies the EventArgs arguments.

Returns

Type	Description
System.Threading.Tasks.Task	Task.

ClearAsync()

Clear out the selected values from the SfDropDownList<TValue, TItem> component and sets the Value and Index properties as null.

Declaration

public Task ClearAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

DropDownClick()

Triggers while clicking the dropdown icon.

Declaration

protected Task DropDownClick()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

FilterAsync(IEnumerable<TItem>, Query, FieldSettingsModel)

To filter the data from given data source by using query.

Declaration

public Task FilterAsync(IEnumerable<TItem> dataSource, Query query = null, FieldSettingsModel fields = null)

Parameters

Type	Name	Description
System.Collections.Generic.IEnumerable<TItem>	dataSource	Specifies the data source.
Query	query	Specifies the query.
FieldSettingsModel	fields	Specifies the fields.

Returns

Type	Description
System.Threading.Tasks.Task	Task.

FilteringAction(IEnumerable<TItem>, Query, FieldSettingsModel)

Task which specifies the filtering action.

Declaration

protected Task FilteringAction(IEnumerable<TItem> dataSource, Query query, FieldSettingsModel fields)

Parameters

Type	Name	Description
System.Collections.Generic.IEnumerable<TItem>	dataSource	Specifies the data source.
Query	query	Specifies the query.
FieldSettingsModel	fields	Specifies the fields.

Returns

Type	Description
System.Threading.Tasks.Task	Task.

FocusAsync()

Sets the focus to the SfDropDownList<TValue, TItem> component for interaction.

Declaration

public Task FocusAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

FocusOutAsync()

Remove the focus from the SfDropDownList<TValue, TItem> component, if the component is in focus state.

Declaration

public Task FocusOutAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

FocusOutHandler(FocusEventArgs, Boolean)

Triggers when the component get focused out.

Declaration

protected Task FocusOutHandler(FocusEventArgs args, bool isFilterinput = false)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Web.FocusEventArgs	args	Specifies the FocusEventArgs arguments.
System.Boolean	isFilterinput	Specifies whether it is a filter input or not.

Returns

Type	Description
System.Threading.Tasks.Task	Task.

GetDataByValue(TValue)

Retrieves all field values in the record that match the given value.

Declaration

public TItem GetDataByValue(TValue ddlValue)

Parameters

Type	Name	Description
TValue	ddlValue	TValue

Returns

Type	Description
TItem	The field value.

GetItemsAsync()

Retrieves all the list of items bound in the SfDropDownList<TValue, TItem> component.

Declaration

public Task<IEnumerable<TItem>> GetItemsAsync()

Returns

Type	Description
System.Threading.Tasks.Task<System.Collections.Generic.IEnumerable<TItem>>	Task.

HidePopupAsync()

Hides the SfDropDownList<TValue, TItem> popup list.

Declaration

public Task HidePopupAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

HideSpinnerAsync()

Hides the data loading spinner.

Declaration

public Task HideSpinnerAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

OnFilterUp(KeyboardEventArgs)

Specifies the keyup event of filter event.

Declaration

protected Task OnFilterUp(KeyboardEventArgs args)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Web.KeyboardEventArgs	args	Specifies the KeyboardEventArgs arguments.

Returns

Type	Description
System.Threading.Tasks.Task	Task.

RefreshDataAsync()

Refreshes the popup list items. The method is useful if the popup list item changed externally.

Declaration

public Task RefreshDataAsync()

Returns

Type	Description
System.Threading.Tasks.Task	System.Threading.Tasks.Task.

SearchList(KeyboardEventArgs)

Task which specifies the search list.

Declaration

protected virtual Task SearchList(KeyboardEventArgs args = null)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Web.KeyboardEventArgs	args	Specifies the KeyboardEventArgs arguments.

Returns

Type	Description
System.Threading.Tasks.Task	Task.

ShowPopupAsync()

Opens the dropdown popup that displays the list of items.

Declaration

public Task ShowPopupAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

ShowSpinnerAsync()

Shows the data loading spinner until the data populate the pop-up.

Declaration

public Task ShowSpinnerAsync()

Returns

Type	Description
System.Threading.Tasks.Task	Task.

UpdateMainData()

Task which update main data.

Declaration

protected virtual void UpdateMainData()

UpdateValue()

Task which updates the value.

Declaration

protected virtual Task UpdateValue()

Returns

Type	Description
System.Threading.Tasks.Task	Task.