Example of Draggable in Blazor Dialog Component

Dialog / Draggable

This example demonstrates the drag-and-drop operation of the Blazor Dialog component. To begin a drag-and-drop operation, select a dialog's header using a mouse and drop them in the desired location. The Dialog can be dragged within the sample container. Enable the 'Open' button to reopen the Dialog if it is closed.

Drag-and-drop operation is enabled using the AllowDragging property. When you configure the Target property, the dialog can be dragged only within its target container. The drag-and-drop feature is used to reposition the dialog dynamically.

More information on the draggable operation of Dialog can be found in the documentation section .

Transform your Blazor web apps today with Syncfusion® Blazor components
100+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE