Class DialogButton

A class used for configuring the button properties in the SfDialog component.

Inheritance

System.Object

DialogButton

Namespace: Syncfusion.Blazor.Popups

Assembly: Syncfusion.Blazor.dll

Syntax

public class DialogButton : OwningComponentBase

Remarks

The DialogButton class provides comprehensive configuration options for buttons within the SfDialog component, including appearance customization, event handling, and button behavior settings. This class supports various button types such as primary buttons, toggle buttons, and flat buttons with configurable icons and content.

Examples

In the following code example, a basic DialogButton has been rendered using the tag directive.

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
        <p>
           Dialog content
        </p>
    </Content>
  </DialogTemplates>
  <DialogButtons>
      <DialogButton IsPrimary="true" Content="Ok" OnClick="@OnBtnClick" />
      <DialogButton Content="Cancel" OnClick="@OnBtnClick" />
  </DialogButtons>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnBtnClick()
  {
    this.Visibility = false;
  }
}

Constructors

DialogButton()

Declaration

public DialogButton()

Properties

ChildContent

Gets or sets the child content for the button including HTML elements. If the child content is not specified, the button is rendered using the Content property.

Declaration

public RenderFragment ChildContent { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.RenderFragment	A Microsoft.AspNetCore.Components.RenderFragment representing the template content. The default value is `null`.

Remarks

The child content specified within the tag directive can be either a string or HTML element. The string content can also be specified using the Content property. When both child content and the Content property are provided, the child content takes precedence over the Content property.

Content

Gets or sets the text content displayed on the button element.

Declaration

public string Content { get; set; }

Property Value

Type	Description
System.String	A `string` value representing the button's text content. The default value is `null`.

Remarks

This property defines the textual content that appears on the button. If both Content and ChildContent are specified, the ChildContent takes precedence over this property.

CssClass

Gets or sets the CSS class string to customize the appearance of the button.

Declaration

public string CssClass { get; set; }

Property Value

Type	Description
System.String	A `string` containing CSS class names separated by spaces to customize the appearance of the button. The default value is `null`.

Remarks

This property allows you to apply custom CSS classes to modify the button's visual appearance, including colors, fonts, borders, and other styling attributes. Multiple CSS classes can be specified by separating them with spaces.

Disabled

Gets or sets a value indicating whether the button is disabled.

Declaration

public bool Disabled { get; set; }

Property Value

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

Remarks

When this property is set to true, the button becomes non-interactive and appears in a disabled state. Users cannot click or interact with the button when it is disabled.

EnableRtl

Gets or sets a value indicating whether to enable right-to-left (RTL) direction for the button.

Declaration

public bool EnableRtl { get; set; }

Property Value

Type	Description
System.Boolean	`true` if the right-to-left direction is enabled for the button; otherwise, `false`. The default value is `false`.

Remarks

This property is useful for supporting languages that are written from right to left, such as Arabic or Hebrew. When enabled, the button's content and icon positioning will be adjusted to support RTL layout.

IconCss

Gets or sets the CSS class string to include an icon or image for the button.

Declaration

public string IconCss { get; set; }

Property Value

Type	Description
System.String	A `string` containing CSS class names separated by spaces to include an icon or image for the button. The default value is `null`.

Remarks

This property allows you to specify CSS classes that define an icon or image to be displayed on the button. The icon's position relative to the button text is controlled by the IconPosition property.

IconPosition

Gets or sets the position of the icon relative to the button content.

Declaration

public IconPosition IconPosition { get; set; }

Property Value

Type	Description
IconPosition	One of the IconPosition enumeration values. The default value is Left.

Remarks

This property determines where the icon appears in relation to the button text:

Left - Icon appears to the left of the button text
Right - Icon appears to the right of the button text
Top - Icon appears above the button text
Bottom - Icon appears below the button text

This property only takes effect when the IconCss property is specified.

IsFlat

Gets or sets a value indicating whether the dialog button uses a flat appearance style.

Declaration

public bool IsFlat { get; set; }

Property Value

Type	Description
System.Boolean	`true` if the flat appearance is enabled for the dialog button; otherwise, `false`. The default value is `true`.

Remarks

When this property is set to true, the button is rendered with a flat appearance without raised borders or shadow effects. This provides a more modern, minimalistic look that is commonly used in dialog buttons. When set to false, the button will have a more traditional raised appearance with borders and shadow effects.

IsPrimary

Gets or sets a value indicating whether the button uses the primary style appearance.

Declaration

public bool IsPrimary { get; set; }

Property Value

Type	Description
System.Boolean	`true` if the primary style is enabled for the button; otherwise, `false`. The default value is `false`.

Remarks

When this property is set to true, the button is rendered with a primary style that typically makes it more prominent, such as using a different background color or emphasis styling. This is commonly used for the main action button in a dialog.

IsToggle

Gets or sets a value indicating whether the button behaves as a toggle button.

Declaration

public bool IsToggle { get; set; }

Property Value

Type	Description
System.Boolean	`true` if the toggle option is enabled for the button; otherwise, `false`. The default value is `false`.

Remarks

When this property is set to true, the button maintains a pressed or active state after being clicked, and clicking it again will deactivate the pressed state. This is useful for buttons that represent on/off states or selections.

OnClick

Gets or sets an event callback that is triggered when the button is clicked.

Declaration

public EventCallback<MouseEventArgs> OnClick { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<Microsoft.AspNetCore.Components.Web.MouseEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked when the button is clicked. The callback receives Microsoft.AspNetCore.Components.Web.MouseEventArgs containing information about the mouse event.

Remarks

The event is triggered for UI-based clicks only, including mouse clicks and keyboard activation (such as pressing Enter or Space). This event allows you to handle button click actions and perform custom logic when the user interacts with the button.

Examples

 
@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>
        Dialog content
      </p>
    </Content>
  </DialogTemplates>
  <DialogButtons>
    <DialogButton IsPrimary="true" Content="Ok" OnClick="@OnBtnClick" />
  </DialogButtons>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnBtnClick()
  {
    this.Visibility = false;
  }
}

Type

Gets or sets the type of button that determines its behavior within forms.

Declaration

public ButtonType Type { get; set; }

Property Value

Type	Description
ButtonType	One of the ButtonType enumeration values. The default value is Button.

Remarks

This property specifies the button's behavior within HTML forms. The possible values are:

Button - Performs a standard button click action
Submit - Sends form data to a server for processing
Reset - Resets the filled values of a form to its initial values

Examples

 
@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>
        Dialog content
      </p>
    </Content>
  </DialogTemplates>
  <DialogButtons>
    <DialogButton Type="ButtonType.Submit" Content="Submit" OnClick="@OnBtnClick" />
  </DialogButtons>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnBtnClick()
  {
    this.Visibility = false;
  }
}

Methods

BuildRenderTree(RenderTreeBuilder)

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

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

Dispose()

Releases all resources used by the DialogButton component.

Declaration

public virtual void Dispose()

Remarks

This method implements the dispose pattern and calls Dispose(Boolean) with true to release both managed and unmanaged resources.

Dispose(Boolean)

Releases the unmanaged resources used by the DialogButton and optionally releases the managed resources.

Declaration

protected override void Dispose(bool disposing)

Parameters

Type	Name	Description
System.Boolean	disposing	`true` to release both managed and unmanaged resources; `false` to release only unmanaged resources.

Remarks

This method is called by the Dispose() method and the finalizer. When called with disposing set to true, it releases all managed resources including removing the button from its parent container and updating button indices.

OnInitializedAsync()

Method invoked when the component is ready to start.

Declaration

protected override Task OnInitializedAsync()

Returns

Type	Description
System.Threading.Tasks.Task	A System.Threading.Tasks.Task representing the asynchronous operation.

Remarks

This method is called after the component has been initialized and is ready to start processing. It initializes the button properties and registers the button with its parent DialogButtons container.

OnParametersSetAsync()

Method invoked when the component has received parameters from its parent.

Declaration

protected override Task OnParametersSetAsync()

Returns

Type	Description
System.Threading.Tasks.Task	A System.Threading.Tasks.Task representing the asynchronous operation.

Remarks

This method is called whenever the component's parameters change. It compares the current parameter values with the previous values and triggers a refresh of the parent DialogButtons container when changes are detected.