Class SfSplitButton

SplitButton component has primary and secondary button. Primary button is used to select
default action and secondary button is used to toggle contextual overlays for displaying list of
action items. It can contain both text and images.

Inheritance

System.Object

SfBaseComponent

SfSplitButton

Inherited Members

SfBaseComponent.Dispose()

SfBaseComponent.Dispose(Boolean)

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

Namespace: Syncfusion.Blazor.SplitButtons

Assembly: Syncfusion.Blazor.dll

Syntax

public class SfSplitButton : SfBaseComponent

Examples

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

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

Constructors

SfSplitButton()

Declaration

public SfSplitButton()

Properties

ChildContent

Gets or sets a value that indicates the child content for the primary button element including HTML element. If the child content is not specified, primary 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 SfSplitButton 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 split button component's primary 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 split button 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 of split button component. The default value is `String.Empty`.

Disabled

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

Declaration

public bool Disabled { get; set; }

Property Value

Type	Description
System.Boolean	`true`, if the split button is disabled. The default value is `false`.

EnableRtl

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

Declaration

public bool EnableRtl { get; set; }

Property Value

Type	Description
System.Boolean	`true`, if the right to left direction is enabled for split 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 split button container element.

Declaration

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

Property Value

Type
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, split button width has been specified as style attribute in SfSplitButton tag directive.

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

IconCss

Gets or sets a value that indicates the CSS class string to include an icon or image for the split 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 split button. The default value is `String.Empty`.

IconPosition

Gets or sets a value that indicates how to display icons in the split 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 split button component. If the IconPosition is Right, the icon will be placed right to the content of the split button component. If the IconPosition is Top, the icon will be placed above the content of the split button component. If the IconPosition is Bottom, the icon will be placed below the content of the split button component.

Items

Gets or sets a value that indicates the action items with its properties which will be rendered as split button's secondary button.

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 split button component's secondary button 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 split button 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 dropdown button is populated using PopupContent.

Examples

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

 
<SfSplitButton 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>  
</SfSplitButton>  
@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
System.Threading.Tasks.Task

Overrides

SfBaseComponent.OnAfterRenderAsync(Boolean)

OnInitializedAsync()

Declaration

protected override Task OnInitializedAsync()

Returns

Type
System.Threading.Tasks.Task

Overrides

SfBaseComponent.OnInitializedAsync()

OnParametersSetAsync()

Declaration

protected override Task OnParametersSetAsync()

Returns

Type
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()