Skip to main content
All docs
V25.1
  • DxGrid.AllowDragRows Property

    Specifies whether users can start the row drag operation.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    [DefaultValue(false)]
    [Parameter]
    public bool AllowDragRows { get; set; }

    Property Value

    Type Default Description
    Boolean false

    true to allow users to start dragging rows; otherwise, false.

    Remarks

    When you activate the AllowDragRows option, the Grid component renders a drag handle for each data row:

    Row Drag Handle

    The AllowedDropTarget property value specifies whether users can reorder rows or move them to other components. To update the data source, handle the target component’s ItemsDropped event.

    Run Demo: Drag and Drop Rows - Reorder View Example: Implement Row Drag and Drop Functionality

    The following example implements row reordering within a Grid:

    Row Reorder

    <DxGrid @ref="Grid"
            Data="DataSource"
            AllowDragRows="true"
            ItemsDropped="Grid_ItemsDropped"
            CssClass="max-h-480">
        <Columns>
            <DxGridDataColumn FieldName="Name" Caption="Subject" MinWidth="220" />
            <DxGridDataColumn FieldName="Status" Caption="Status" Width="140px" MinWidth="140" />
            <DxGridDataColumn FieldName="CreatedDate" Caption="Created" Width="120px" MinWidth="120" />
            <DxGridDataColumn FieldName="FixedDate" Caption="Fixed" Width="120px" MinWidth="120" />
        </Columns>
    </DxGrid>
    
    @code {
        IGrid Grid;
        ObservableCollection<Issue> DataSource { get; set; }
        protected override async Task OnInitializedAsync() {
            DataSource = new ObservableCollection<Issue>(await IssuesDataService.GetIssuesAsync());
        }
        void Grid_ItemsDropped(GridItemsDroppedEventArgs evt) {
            var droppedItem = (Issue)evt.DroppedItems[0];
            DataSource.Remove(droppedItem);
            var targetItem = (Issue)evt.TargetItem;
            var index = targetItem != null
                ? DataSource.IndexOf(targetItem) + (evt.DropPosition == GridItemDropPosition.After ? 1 : 0)
                : DataSource.Count;
            DataSource.Insert(index, droppedItem);
        }
    }
    

    Implements

    See Also