Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class SfDropDownButton

    Show / Hide Table of Contents

    Class SfDropDownButton

    The DropDownButton component is used to toggle contextual overlays for displaying list of action items. It can contain a text, an icon, svg or both.

    Inheritance
    System.Object
    SfBaseComponent
    SfDropDownButton
    Inherited Members
    SfBaseComponent.Dispose()
    SfBaseComponent.Dispose(Boolean)
    SfBaseComponent.OnObservableChange(String, Object, Boolean, NotifyCollectionChangedEventArgs)
    Namespace: Syncfusion.Blazor.SplitButtons
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class SfDropDownButton : SfBaseComponent
    Examples

    In the below code example, a basic DropDownButton component initialized with DropDownMenuItems and DropDownMenuItem tag directives.

     
    <SfDropDownButton> 
       <DropDownMenuItems> 
          <DropDownMenuItem Text="Dashboard"></DropDownMenuItem> 
          <DropDownMenuItem Text="Notifications"></DropDownMenuItem> 
          <DropDownMenuItem Text="User Settings"></DropDownMenuItem> 
          <DropDownMenuItem Text="Log Out"></DropDownMenuItem> 
       </DropDownMenuItems> 
    </SfDropDownButton> 

    Constructors

    SfDropDownButton()

    Declaration
    public SfDropDownButton()

    Properties

    ChildContent

    Gets or sets a value that indicates the child content for the dropdown button including HTML element. If the child content is not specified, Dropdown button is rendered using Content property.

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

    The template content. The default value is null.

    Remarks

    The child content which is specified within SfDropDownButton tag directive is either a string or HTML Element. The string content is also specified using Content property.

    Content

    Gets or sets a value that indicates the content of dropdown button.

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

    Accepts a string value. The default value is String.Empty.

    Remarks

    Set child content within SfDropDownButton tag directive, to render as HTML content.

    CssClass

    Gets or sets a value that indicates the CSS class string to customize the appearance of dropdown button.

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

    Accepts a CSS class string separated by space to customize the appearance of dropdown button. The default value is String.Empty.

    Disabled

    Gets or sets whether the dropdown button is disabled or not.

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

    true, if the dropdown button component is disabled. The default value is false.

    EnableRtl

    Gets or sets whether the right to left direction is enabled for dropdown button.

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

    true, if the right to left direction is enabled for dropdown button. The default value is false.

    HtmlAttributes

    Gets or sets a collection of additional attributes such as id, title etc. that will applied to the dropdown button container element.

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

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

    Examples

    In the below code example, dropdown button width has been specified as style attribute in SfButton tag directive.

     
    <SfDropDownButton style="width:200px"> 
       <DropDownMenuItems> 
          <DropDownMenuItem Text="Dashboard"></DropDownMenuItem> 
          <DropDownMenuItem Text="Notifications"></DropDownMenuItem> 
          <DropDownMenuItem Text="User Settings"></DropDownMenuItem> 
          <DropDownMenuItem Text="Log Out"></DropDownMenuItem> 
       </DropDownMenuItems> 
    </SfDropDownButton> 

    IconCss

    Gets or sets a a value that indicates the CSS class string to include an icon or image for the dropdown button.

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

    Accepts a CSS class string separated by space to include an icon or image for the dropdown button. The default value is String.Empty.

    IconPosition

    Gets or sets a value that indicates how to display icons in the dropdown button.

    Declaration
    public SplitButtonIconPosition IconPosition { get; set; }
    Property Value
    Type Description
    SplitButtonIconPosition

    One of the IconPosition enumeration. The default value is Left.

    Remarks

    If the IconPosition is Left, the icon will be placed left to the content of the dropdown button. If the IconPosition is Right, the icon will be placed right to the content of the dropdown button. If the IconPosition is Top, the icon will be placed above the content of the dropdown button. If the IconPosition is Bottom, the icon will be placed below the content of the dropdown button.

    Items

    Gets or sets a value that indicates the the action items with its properties which will be rendered in dropdown button popup.

    Declaration
    public List<DropDownMenuItem> Items { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.List<DropDownMenuItem>

    Accepts a collection of DropDownMenuItem object. The default value is null.

    Remarks

    If the Items property is not specified, the dropdown button component is populated using DropDownMenuItems and DropDownMenuItem tag directives.

    PopupContent

    Gets or sets a value that indicates the custom element as action items which will be rendered in DropDownButton popup.

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

    The template content. The default value is null.

    Remarks

    If the Items property and DropDownMenuItems tag directive is not specified, the DropDownButton component is populated using PopupContent.

    Examples

    In the below code example, a dropdown button component rendered with ListView component as PopupContent.

     
    <SfDropDownButton CssClass="e-caret-hide" IconCss="e-icons e-down"> 
    <PopupContent>  
    <SfListView ID="listview" DataSource="@Data" ShowCheckBox="true"> 
    <ListViewFieldSettings Text="Text" TValue="ListData"></ListViewFieldSettings> 
    </SfListView> 
    </PopupContent>  
    </SfDropDownButton>  
    @code { 
    public List<ListData> Data = new List<ListData>{  
    new ListData{ Class = "data", Text = "Print", Id = "data1" },  
    new ListData{ Class = "data", Text = "Save As", Id = "data2" },  
    new ListData{ Class = "data", Text = "Update Folder", Id = "data3" }, 
    new ListData{ Class = "data", Text = "Reply", Id = "data4" }  
    };  
    public class ListData {  
    public string Text { get; set; }  
    public string Id { get; set; }  
    public string Class { get; set; }  
    } 
    } 

    Methods

    AddItems(List<DropDownMenuItem>, String, Boolean)

    Adds a new item to the menu. By default, new item appends to the list as the last item, but you can insert based on the text parameter.

    Declaration
    public void AddItems(List<DropDownMenuItem> items, string text = null, bool isUniqueId = false)
    Parameters
    Type Name Description
    System.Collections.Generic.List<DropDownMenuItem> items

    Specifies the list of items to be added.

    System.String text

    Specifies the existing item text. If specified, adds the items of the collection before this item. If not specified, adds the items of the collection to the end of the list.

    System.Boolean isUniqueId

    Set true if text parameter is a unique id.

    BuildRenderTree(RenderTreeBuilder)

    Declaration
    protected override void BuildRenderTree(RenderTreeBuilder __builder)
    Parameters
    Type Name Description
    Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder __builder

    OnAfterRenderAsync(Boolean)

    Declaration
    protected override Task OnAfterRenderAsync(bool firstRender)
    Parameters
    Type Name Description
    System.Boolean firstRender
    Returns
    Type Description
    System.Threading.Tasks.Task
    Overrides
    SfBaseComponent.OnAfterRenderAsync(Boolean)

    OnInitializedAsync()

    Declaration
    protected override Task OnInitializedAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task
    Overrides
    SfBaseComponent.OnInitializedAsync()

    OnParametersSetAsync()

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

    RemoveItems(List<String>, Boolean)

    Removes the items from the menu.

    Declaration
    public void RemoveItems(List<string> items, bool isUniqueId = false)
    Parameters
    Type Name Description
    System.Collections.Generic.List<System.String> items

    Specifies the list of items to be removed.

    System.Boolean isUniqueId

    Set true if text parameter is a unique id.

    Toggle()

    Opens/closes a DropDownButton popup based on current state of the DropDownButton.

    Declaration
    public void Toggle()
    Back to top Generated by DocFX
    Copyright © 2001 - 2023 Syncfusion Inc. All Rights Reserved