Skip to main content
A newer version of this page is available. .

DxGrid.EditStart Event

Fires before the edit form appears.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public EventCallback<GridEditStartEventArgs> EditStart { get; set; }

Parameters

Type Description
GridEditStartEventArgs

A GridEditStartEventArgs object that contains data for this event.

Remarks

The Grid allows users to edit its data either by using the edit form or by showing the edit form in a pop-up window.

Tip

For information on how to enable data editing, refer to the following topic: Edit Data and Validate Input.

The EditStart event occurs in the following cases:

Handle this event to create a custom response to the edit start action. Use the IsNew event argument to identify whether the edit form is used for a new or existing row. The DataItem property returns the processed data item. You can also access the Grid object and use its members to obtain additional information about the Grid.

You can also set the Cancel property to true to prevent the edit form from being shown.

The following example demonstrates how to prevent users from editing unselected rows:

@using Microsoft.EntityFrameworkCore
@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory
@implements IDisposable

<DxGrid Data="GridDataSource"
        EditModelSaving="OnEditModelSaving"
        KeyFieldName="EmployeeId"
        AllowSelectRowByClick="true"
        SelectionMode="GridSelectionMode.Single"
        @bind-SelectedDataItem="@SelectedDataItem"
        EditStart="OnEditStart">
    <Columns>
        <DxGridCommandColumn DeleteButtonVisible="false" />
        <DxGridDataColumn FieldName="FirstName" />
        <DxGridDataColumn FieldName="LastName" />
        <DxGridDataColumn FieldName="Title" />
        <DxGridDataColumn FieldName="HireDate" />
    </Columns>
    <EditFormTemplate Context="editFormContext">
        @{
            var employee = (Employee)editFormContext.EditModel;
        }
        <DxFormLayout>
            <DxFormLayoutItem Caption="First Name:">
                <DxTextBox @bind-Text="@employee.FirstName" />
            </DxFormLayoutItem>
            <DxFormLayoutItem Caption="Last Name:">
                <DxTextBox @bind-Text="@employee.LastName" />
            </DxFormLayoutItem>
            <DxFormLayoutItem Caption="Title:">
                <DxTextBox @bind-Text="@employee.Title" />
            </DxFormLayoutItem>
            <DxFormLayoutItem Caption="Hire Date:">
                <DxDateEdit @bind-Date="@employee.HireDate" />
            </DxFormLayoutItem>
        </DxFormLayout>
    </EditFormTemplate>
</DxGrid>

@code {
    IEnumerable<object> GridDataSource { get; set; }
    NorthwindContext Northwind { get; set; }
    object SelectedDataItem { get; set; }

    protected override async Task OnInitializedAsync() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        GridDataSource = await Northwind.Employees.ToListAsync();
        SelectedDataItem = GridDataSource.FirstOrDefault();
    }

    async Task OnEditModelSaving(GridEditModelSavingEventArgs e) {
        var editModel = (Employee)e.EditModel;
        var dataItem = e.IsNew ? new Employee() : Northwind.Employees.Find(editModel.EmployeeId);
        if (dataItem != null) {
            dataItem.FirstName = editModel.FirstName;
            dataItem.LastName = editModel.LastName;
            dataItem.Title = editModel.Title;
            dataItem.HireDate = editModel.HireDate;
            if (e.IsNew)
                await Northwind.AddAsync(dataItem);
            await Northwind.SaveChangesAsync();
            GridDataSource = await Northwind.Employees.ToListAsync();
        }
    }

    async Task OnEditStart(GridEditStartEventArgs e) {
        if (!e.IsNew && !e.Grid.IsDataItemSelected(e.DataItem))
            e.Cancel = true;
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}
See Also