Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class SfMultiSelect<TValue, TItem>

    Show / Hide Table of Contents

    Class SfMultiSelect<TValue, TItem>

    The MultiSelect component contains a list of predefined values from which a multiple value can be chosen.

    Inheritance
    System.Object
    SfBaseComponent
    SfDataBoundComponent
    SfDropDownBase<TItem>
    SfMultiSelect<TValue, TItem>
    Inherited Members
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.RenderListItemsAsync(System.Collections.Generic.IEnumerable<TItem>, Syncfusion.Blazor.DropDowns.FieldSettingsModel, Syncfusion.Blazor.Data.Query)
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.SetListDataAsync(System.Collections.Generic.IEnumerable<TItem>, Syncfusion.Blazor.DropDowns.FieldSettingsModel, Syncfusion.Blazor.Data.Query)
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.GetPropertyValue(System.Object, System.String)
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ActionBeginAsync(System.Collections.Generic.IEnumerable<TItem>, Syncfusion.Blazor.Data.Query)
    SfDropDownBase<TItem>.ActionCompleteAsync(IEnumerable<TItem>, Query)
    SfDropDownBase<TItem>.ActionFailureAsync(Object)
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.GetQuery(Syncfusion.Blazor.Data.Query)
    SfDropDownBase<TItem>.SetFields()
    SfDropDownBase<TItem>.ExecuteSimpleQuery(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>.IsPrimitiveDataType()
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.AddItems(System.Collections.Generic.IEnumerable<TItem>, System.Nullable<System.Int32>)
    SfDropDownBase<TItem>.AddItemsAsync(IEnumerable<TItem>, Nullable<Int32>)
    SfDropDownBase<TItem>.InsertItemAsync(IEnumerable<TItem>, Nullable<Int32>, Boolean)
    SfDropDownBase<TItem>.IsFilterMode()
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.RenderItemsAsync(System.Collections.Generic.IEnumerable<TItem>)
    SfDropDownBase<TItem>.GetGroupedDataSourceAsync(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>.reflectionHelper
    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>.IsActionFailed
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.TotalCount
    Syncfusion.Blazor.DropDowns.SfDropDownBase<TItem>.ComponentName
    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
    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 SfMultiSelect<TValue, TItem> : SfDropDownBase<TItem>, IDropDowns
    Type Parameters
    Name Description
    TValue

    Specifies the value type.

    TItem

    Specifies the type of SfMultiSelect.

    Constructors

    SfMultiSelect()

    Declaration
    public SfMultiSelect()

    Properties

    AllowCustomValue

    Allows user to add a Custom value the value which is not present in the suggestion list.

    Declaration
    public bool AllowCustomValue { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, allows the user to enter a custom value that is not present in the suggestion list. Otherwise, false.

    AllowFiltering

    To enable the filtering option in this component.

    Filter action performs when type in search box and collect the matched item through `Filtering` event.

    If searching character does not match, `NoRecordsTemplate` property value will be shown.

    Declaration
    public bool AllowFiltering { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the filtering option can be enabled. Otherwise, false.

    CssClass

    Specifies the CSS class name that can be appended with the root element of the MultiSelect. One or more custom CSS classes can be added to a MultiSelect.

    Declaration
    public string CssClass { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the CSS class string separated by space to customize the appearance of component.

    DelimiterChar

    Sets the delimiter character for 'default' and 'delimiter' visibility modes.

    Declaration
    public string DelimiterChar { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value. The default value is ,.

    EnableChangeOnBlur

    By default, the MultiSelect component fires the Change event while focus out the component.

    If you want to fires the Change event on every value selection and remove, then disable the EnabledChangeOnBlur property.

    Declaration
    public bool EnableChangeOnBlur { get; set; }
    Property Value
    Type Description
    System.Boolean

    The default value of EnableChangeOnBlur is true, which means the MultiSelect component fires the Change event while focus out the component.

    EnableCloseOnSelect

    Based on the property, when item get select popup visibility state will changed.

    Declaration
    public bool EnableCloseOnSelect { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the popup visibility state change while selecting the item. Otherwise, false. The default value is true.

    Enabled

    Specifies a boolean value that indicates whether the component allows the user to interact with it.

    Declaration
    public bool Enabled { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, allows the user to interact with the component. Otherwise, false. The default value is true.

    EnableGroupCheckBox

    Specifies a boolean value that indicates the whether the grouped list items are allowed to check by checking the group header in checkbox mode.

    By default, there is no checkbox provided for group headers.

    This property allows you to render checkbox for group headers and to select all the grouped items at once.

    Declaration
    public bool EnableGroupCheckBox { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the group check box can be enabled. Otherwise, false. The default value is false.

    EnablePersistence

    Enable or disable persisting component's state between page reloads.

    If enabled, the `Value` state will be persisted.

    • Value
    Declaration
    public bool EnablePersistence { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the persistence can be enabled. Otherwise, false.

    EnableRtl

    Enable or disable rendering component in right to left direction.

    Declaration
    public bool EnableRtl { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the right to left direction can be enabled. Otherwise, false. The default value is false.

    EnableSelectionOrder

    Reorder the selected items in popup visibility state.

    Declaration
    public bool EnableSelectionOrder { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the selection order can be enabled. Otherwise, false. The default value is true.

    EnableVirtualization

    The Virtual Scrolling feature is used to display a large amount of data that you require without buffering the entire load of a huge database records in the DropDowns, that is, when scrolling, the datamanager request is sent to fetch some amount of data from the server dynamically. To achieve this scenario with DropDowns, set the EnableVirtualization to true.

    Declaration
    public bool EnableVirtualization { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the virtual scrolling can be enabled. Otherwise, false.

    FilterBarPlaceholder

    Accepts the value to be displayed as a watermark text on the filter bar.

    Declaration
    public string FilterBarPlaceholder { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    FloatLabelType

    Specifies the floating label behavior of the MultiSelect that the placeholder text floats above the MultiSelect based on the following values.

    Possible values are:

    • NeverNever floats the label in the MultiSelect when the placeholder is available.
    • AlwaysThe floating label always floats above the MultiSelect.
    • AutoThe floating label floats above the MultiSelect after focusing it or when enters the value in it.
    Declaration
    public FloatLabelType FloatLabelType { get; set; }
    Property Value
    Type Description
    FloatLabelType

    The default value of FloatLabelType is Auto, which means the floating label floats above the MultiSelect after focusing it or when entering a value in it.

    FooterTemplate

    Accepts the template design and assigns it to the footer container of the popup list.

    Declaration
    public RenderFragment FooterTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.RenderFragment

    HeaderTemplate

    Accepts the template design 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

    HideSelectedItem

    Hides the selected item from the list item.

    Declaration
    public bool HideSelectedItem { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the selected item should be shown. Otherwise, false. The default value is true.

    HtmlAttributes

    You can add the additional input attributes such as disabled, value, and more to the root element.

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

    Declaration
    public Dictionary<string, object> HtmlAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>

    A dictionary of additional HTML attributes for the root element of the component.

    ID

    Specifies the id of the MultiSelect component.

    Declaration
    public string ID { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    InputAttributes

    You can add the additional input attributes such as disabled, value, and more to the root element.

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

    Declaration
    public Dictionary<string, object> InputAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>

    A dictionary of additional input attributes for the root element of the component.

    ItemsCount

    The data can be fetched in popup based on ItemsCount, when enabled the EnableVirtualization.

    Declaration
    public int ItemsCount { get; set; }
    Property Value
    Type Description
    System.Int32

    Accepts an integer value that represents fetched data in popup based on items count. The default value is 5.

    MaximumSelectionLength

    Sets limitation to the value selection.

    Based on the limitation, list selection will be prevented.

    Declaration
    public int MaximumSelectionLength { get; set; }
    Property Value
    Type Description
    System.Int32

    An integer value representing the maximum number of items that can be selected in the list. The default value is 1000.

    Mode

    configures visibility mode for component interaction.

    Declaration
    public VisualMode Mode { get; set; }
    Property Value
    Type Description
    VisualMode

    Specifies the mode that determines the visibility and interactivity of the component.

    OpenOnClick

    Whether to automatically open the popup when the control is clicked.

    Declaration
    public bool OpenOnClick { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, the popup automatically opened while clicking the control. Otherwise, false. The default value is true.

    Placeholder

    Specifies the text that is shown as a hint or placeholder until the user focuses or enter a value in MultiSelect. The property is depending on the FloatLabelType property.

    Declaration
    public string Placeholder { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    PopupHeight

    Gets or sets the height of the popup list. By default, it renders based on its list item.

    Declaration
    public string PopupHeight { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value. The default value is 300px.

    PopupWidth

    Gets or sets the width of the popup list and percentage values has calculated based on input width.

    Declaration
    public string PopupWidth { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value. The default value is 100%.

    Readonly

    Specifies the boolean value whether the MultiSelect allows the user to change the value.

    Declaration
    public bool Readonly { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the MultiSelect component can be enabled. Otherwise, false.

    SelectAllText

    Specifies the selectAllText to be displayed on the component.

    Declaration
    public string SelectAllText { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    ShowClearButton

    Enables close icon with the each selected item.

    Declaration
    public bool ShowClearButton { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the clear button should be shown. Otherwise, false. The default value is true.

    ShowDropDownIcon

    Allows you to either show or hide the DropDown button on the component.

    Declaration
    public bool ShowDropDownIcon { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the drop down button should be shown. Otherwise, false.

    ShowSelectAll

    Allows you to either show or hide the selectAll option on the component.

    Declaration
    public bool ShowSelectAll { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the select all option should be shown. Otherwise, false.

    TabIndex

    Specifies the tab order of the DropDownList component.

    Declaration
    public int TabIndex { get; set; }
    Property Value
    Type Description
    System.Int32

    An integer value representing the tab index of MultiSelect DropDown component.

    Text

    Selects the list item which maps the data Text field in the component.

    Declaration
    public string Text { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    UnSelectAllText

    Specifies the UnSelectAllText to be displayed on the component.

    Declaration
    public string UnSelectAllText { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    Value

    Selects the list item which maps the data Value field in the component.

    Declaration
    public TValue Value { get; set; }
    Property Value
    Type Description
    TValue

    The current value of the multi select component.

    ValueChanged

    Specifies the callback to trigger when the value changes.

    Declaration
    public EventCallback<TValue> ValueChanged { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.EventCallback<TValue>

    ValueExpression

    Specifies the expression for defining the value of the bound.

    Declaration
    public Expression<Func<TValue>> ValueExpression { get; set; }
    Property Value
    Type Description
    System.Linq.Expressions.Expression<System.Func<TValue>>

    ValueTemplate

    Accepts the template design 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>

    Width

    Gets or sets the width of the component. By default, it sizes based on its parent. container dimension.

    Declaration
    public string Width { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string 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

    ClearAsync()

    Allows you to clear the selected values from the MultiSelect component.

    Declaration
    public Task ClearAsync()
    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 MultiSelect component for interaction.

    Declaration
    public Task FocusAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    FocusOutAsync()

    Remove the focus from the MultiSelect component, if the component is in focus state.

    Declaration
    public Task FocusOutAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    GetDataByValueAsync(TValue)

    Gets the array of data Object that matches the given array of values.

    Declaration
    public Task<List<TItem>> GetDataByValueAsync(TValue dataValue)
    Parameters
    Type Name Description
    TValue dataValue

    Specifies the value(s).

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

    Task.

    GetItemsAsync()

    Gets all the list items bound on this component.

    Declaration
    public Task<IEnumerable<TItem>> GetItemsAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task<System.Collections.Generic.IEnumerable<TItem>>

    Task.

    HidePopupAsync()

    Hides the popup if it is in an open state.

    Declaration
    public Task HidePopupAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    HideSpinner()

    Hides the spinner loader.

    Declaration
    public Task HideSpinner()
    Returns
    Type Description
    System.Threading.Tasks.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.

    SelectAllAsync(Boolean)

    Based on the state parameter, entire list item will be selected/deselected.

    parameter

    • TrueSelects entire list items.
    • FalseUn Selects entire list items.
    Declaration
    public Task SelectAllAsync(bool state)
    Parameters
    Type Name Description
    System.Boolean state

    Specifies the state.

    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    ShowPopupAsync()

    Opens the popup that displays the list of items.

    Declaration
    public Task ShowPopupAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    ShowSpinner()

    Shows the spinner loader.

    Declaration
    public Task ShowSpinner()
    Returns
    Type Description
    System.Threading.Tasks.Task

    UpdateValue()

    Task which updates the value.

    Declaration
    protected Task UpdateValue()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    Back to top Generated by DocFX
    Copyright © 2001 - 2023 Syncfusion Inc. All Rights Reserved