Class DialogEvents

A class used for configuring the SfDialog component events.

Inheritance

System.Object

DialogEvents

Namespace: Syncfusion.Blazor.Popups

Assembly: Syncfusion.Blazor.dll

Syntax

public class DialogEvents : OwningComponentBase

Remarks

The DialogEvents class provides event handling capabilities for the SfDialog component. It allows developers to respond to various dialog lifecycle events such as opening, closing, dragging, and resizing operations. All event callbacks are optional and can be used to implement custom logic during different phases of dialog interaction.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents 
    OnOpen="OnOpenHandler" 
    Opened="OnOpenedHandler" 
    OnClose="OnCloseHandler" 
    Closed="OnClosedHandler">
  </DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnOpenHandler(BeforeOpenEventArgs args) { }
  private void OnOpenedHandler(OpenEventArgs args) { }
  private void OnCloseHandler(BeforeCloseEventArgs args) { }
  private void OnClosedHandler(CloseEventArgs args) { }
}

Constructors

DialogEvents()

Declaration

public DialogEvents()

Properties

Closed

Gets or sets the event callback that will be invoked when the SfDialog is closed.

Declaration

public EventCallback<CloseEventArgs> Closed { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<CloseEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked after the dialog is closed. The callback receives a CloseEventArgs argument.

Remarks

This event is triggered after the SfDialog has been completely closed and all closing animations have finished. It provides information about how the dialog was closed and allows you to perform cleanup operations or update application state. Use this event when you need to execute logic after the dialog has been fully closed.

Examples

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

Created

Gets or sets the event callback that will be invoked when the SfDialog rendering is completed.

Declaration

public EventCallback<object> Created { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<System.Object>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked when the dialog component has been created and rendered. The callback receives an `object` argument.

Remarks

This event is triggered once the SfDialog component has been fully created and rendered in the DOM. It provides an opportunity to perform initialization tasks, set up additional event handlers, or configure the dialog after it has been created. This event occurs during the component lifecycle, typically after the first render.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents Created="OnCreatedHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnCreatedHandler(object args)
  {
    // Write your initialization code here.
  }
}

Destroyed

Gets or sets the event callback that will be invoked when the SfDialog disposing is completed.

Declaration

public EventCallback<object> Destroyed { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<System.Object>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked when the dialog component is being destroyed. The callback receives an `object` argument.

Remarks

This event is triggered when the SfDialog component is being disposed and removed from the DOM. It provides an opportunity to perform cleanup operations, remove event handlers, or free resources before the component is destroyed. This event occurs during the component disposal process, typically when the component is being unmounted.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents Destroyed="OnDestroyedHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnDestroyedHandler(object args)
  {
    // Write your cleanup code here.
  }
}

OnClose

Gets or sets the event callback that will be invoked before the SfDialog is closed.

Declaration

public EventCallback<BeforeCloseEventArgs> OnClose { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<BeforeCloseEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked before the dialog is closed. The callback receives a BeforeCloseEventArgs argument.

Remarks

This event is triggered before the SfDialog begins its closing process and animations. It provides an opportunity to prevent the dialog from closing by setting the Cancel property of the event arguments to true. You can use this event to validate user input, show confirmation messages, or perform other pre-closing operations.

Examples

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

OnDrag

Gets or sets the event callback that will be invoked when the SfDialog is being dragged.

Declaration

public EventCallback<DragEventArgs> OnDrag { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<DragEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked during the drag operation of the dialog. The callback receives a DragEventArgs argument.

Remarks

This event is triggered continuously while the SfDialog is being dragged by the user. It provides real-time information about the drag operation, including the current position and movement details. You can use this event to implement custom drag behaviors, update UI elements, or track the dialog's position during dragging. Note that dragging must be enabled on the dialog for this event to be triggered.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" AllowDragging="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnDrag="OnDragHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnDragHandler(DragEventArgs args)
  {
    // Write your code here.
  }
}

OnDragStart

Gets or sets the event callback that will be invoked when the drag operation of the SfDialog is initiated.

Declaration

public EventCallback<DragStartEventArgs> OnDragStart { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<DragStartEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked when the drag operation begins. The callback receives a DragStartEventArgs argument.

Remarks

This event is triggered when the user begins dragging the SfDialog by clicking and holding the dialog header or designated drag area. It provides information about the initial drag state and allows you to perform setup operations before the drag begins. You can use this event to initialize drag-related variables, show visual indicators, or cancel the drag operation if needed. Note that dragging must be enabled on the dialog for this event to be triggered.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" AllowDragging="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnDragStart="OnDragStartHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnDragStartHandler(DragStartEventArgs args)
  {
    // Write your code here.
  }
}

OnDragStop

Gets or sets the event callback that will be invoked when the drag operation of the SfDialog is stopped.

Declaration

public EventCallback<DragStopEventArgs> OnDragStop { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<DragStopEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked when the drag operation ends. The callback receives a DragStopEventArgs argument.

Remarks

This event is triggered when the user stops dragging the SfDialog by releasing the mouse button or touch. It provides information about the final position and state of the dialog after the drag operation is complete. You can use this event to perform cleanup operations, save the dialog position, or update related UI elements after dragging ends. Note that dragging must be enabled on the dialog for this event to be triggered.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" AllowDragging="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnDragStop="OnDragStopHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnDragStopHandler(DragStopEventArgs args)
  {
    // Write your code here.
  }
}

OnOpen

Gets or sets the event callback that will be invoked before the SfDialog is opened.

Declaration

public EventCallback<BeforeOpenEventArgs> OnOpen { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<BeforeOpenEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked before the dialog is opened. The callback receives a BeforeOpenEventArgs argument.

Remarks

This event is triggered before the SfDialog begins its opening process and animations. It provides an opportunity to prevent the dialog from opening by setting the Cancel property of the event arguments to true. You can use this event to validate conditions, prepare data, or perform other pre-opening operations before the dialog becomes visible.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnOpen="OnOpenHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnOpenHandler(BeforeOpenEventArgs args)
  {
    // Write your code here.
  }
}

OnOverlayModalClick

Gets or sets the event callback that will be invoked when the SfDialog modal overlay is clicked.

Declaration

public EventCallback<OverlayModalClickEventArgs> OnOverlayModalClick { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<OverlayModalClickEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked when the modal overlay is clicked. The callback receives an OverlayModalClickEventArgs argument.

Remarks

This event is triggered when the user clicks on the modal overlay (backdrop) of the SfDialog when it is displayed in modal mode. It provides an opportunity to respond to overlay clicks, which commonly involves closing the dialog or showing confirmation messages. This event is only applicable when the dialog is configured as a modal dialog using the IsModal property. You can prevent the default overlay click behavior by handling this event appropriately.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" IsModal="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnOverlayModalClick="OnOverlayModalClickHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnOverlayModalClickHandler(OverlayModalClickEventArgs args)
  {
    // Write your code here.
  }
}

OnResizeStart

Gets or sets the event callback that will be invoked when the resize operation of the SfDialog is initiated.

Declaration

public EventCallback<MouseEventArgs> OnResizeStart { 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 resize operation begins. The callback receives a Microsoft.AspNetCore.Components.Web.MouseEventArgs argument.

Remarks

This event is triggered when the user begins resizing the SfDialog by clicking and dragging the resize handles. It provides information about the mouse event that initiated the resize operation. You can use this event to perform setup operations, show visual indicators, or initialize resize-related variables before the resize begins. Note that resizing must be enabled on the dialog for this event to be triggered.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" EnableResize="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnResizeStart="OnResizeStartHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnResizeStartHandler(MouseEventArgs args)
  {
    // Write your code here.
  }
}

OnResizeStop

Gets or sets the event callback that will be invoked when the resize operation of the SfDialog is stopped.

Declaration

public EventCallback<MouseEventArgs> OnResizeStop { 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 resize operation ends. The callback receives a Microsoft.AspNetCore.Components.Web.MouseEventArgs argument.

Remarks

This event is triggered when the user stops resizing the SfDialog by releasing the mouse button after dragging a resize handle. It provides information about the final mouse event and allows you to perform cleanup operations or save the dialog's new size. You can use this event to update related UI elements, persist size settings, or trigger other actions after the resize is complete. Note that resizing must be enabled on the dialog for this event to be triggered.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" EnableResize="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents OnResizeStop="OnResizeStopHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnResizeStopHandler(MouseEventArgs args)
  {
    // Write your code here.
  }
}

Opened

Gets or sets the event callback that will be invoked when the SfDialog is opened.

Declaration

public EventCallback<OpenEventArgs> Opened { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<OpenEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked after the dialog is opened. The callback receives an OpenEventArgs argument.

Remarks

This event is triggered after the SfDialog has been completely opened and all opening animations have finished. It provides confirmation that the dialog is now fully visible and interactive to the user. You can use this event to perform post-opening operations such as setting focus, initializing content, or updating application state.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents Opened="OnOpenedHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnOpenedHandler(OpenEventArgs args)
  {
    // Write your code here.
  }
}

Resizing

Gets or sets the event callback that will be invoked when the SfDialog is being resized.

Declaration

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

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<Microsoft.AspNetCore.Components.Web.MouseEventArgs>	An Microsoft.AspNetCore.Components.EventCallback<> that is invoked during the resize operation of the dialog. The callback receives a Microsoft.AspNetCore.Components.Web.MouseEventArgs argument.

Remarks

This event is triggered continuously while the SfDialog is being resized by the user dragging the resize handles. It provides real-time information about the resize operation, including mouse position and movement details. You can use this event to implement custom resize behaviors, update UI elements in real-time, or apply constraints during the resize process. Note that resizing must be enabled on the dialog for this event to be triggered.

Examples

@using Syncfusion.Blazor.Popups
<SfDialog Width="500px" @bind-Visible="Visibility" EnableResize="true">
  <DialogTemplates>
    <Content>
      <p>Dialog content</p>
    </Content>
  </DialogTemplates>
  <DialogEvents Resizing="OnResizingHandler"></DialogEvents>
</SfDialog>
@code {
  private bool Visibility { get; set; } = true;
  private void OnResizingHandler(MouseEventArgs args)
  {
    // Write your code here.
  }
}

Methods

Dispose()

Dispose the unmanaged resources.

Declaration

public virtual void Dispose()

Remarks

This method performs cleanup operations for the DialogEvents component. It calls the protected Dispose(Boolean) method with true to indicate that managed resources should be disposed.

Dispose(Boolean)

Dispose the unmanaged resources.

Declaration

protected override void Dispose(bool disposing)

Parameters

Type	Name	Description
System.Boolean	disposing	A `bool` value indicating whether to dispose managed resources. `true` to dispose managed resources; otherwise, `false`.

Remarks

This method performs the actual cleanup of resources used by the DialogEvents component. When disposing is true, it cleans up managed resources including clearing the reference to the parent SfDialog component.

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 any asynchronous operation.

Remarks

This method is called when the DialogEvents component is initialized and establishes the connection with its parent SfDialog component. It sets up the event delegation relationship that allows the dialog to trigger the configured event callbacks.