DataGrid InLine Edit

In InLine edit grid, I want to be able to prevent the user from moving to another line when user have a line in edit mode


1 Reply 1 reply marked as answer

PS Prathap Senthil Syncfusion Team October 3, 2024 06:13 PM UTC

Hi MohammadReza Mt,

Based on your requirements, we suggest the following approach to prevent the user from moving to another line while a line is in edit mode. Kindly refer to the code snippet and sample below for your reference.

<SfGrid DataSource="@Orders" ID="Grid" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" Height="315">

    <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="Syncfusion.Blazor.Grids.EditMode.Normal"></GridEditSettings>

    <GridEvents RowUpdating="RowUpdatingHandler" OnToolbarClick="ToolbarClickHandler" RowEdited="RowEditedHandler" TValue="Order"></GridEvents>

</SfGrid>

 

@code {

 

    public bool IsEdit { get; set; } = false;

 

    public void RowEditedHandler(Syncfusion.Blazor.Grids.RowEditedEventArgs<Order> args)

    {

        IsEdit = true;

    }

 

    public void RowUpdatingHandler(Syncfusion.Blazor.Grids.RowUpdatingEventArgs<Order> args)

    {

        if (IsEdit)

        {

            args.Cancel = true;

        }

    }

 

 

 

    public void ToolbarClickHandler(Syncfusion.Blazor.Navigations.ClickEventArgs args)

    {

        if (args.Item.Id == "Grid_update")  //Id is combination of Grid's ID and itemname

        {

            IsEdit = false;

        }

    }

 

 

 

}


Sample:
https://blazorplayground.syncfusion.com/embed/VtBpCttKzxVbyqeW?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Reference:
https://blazor.syncfusion.com/documentation/datagrid/events#rowedited

https://blazor.syncfusion.com/documentation/datagrid/events#ontoolbarclick
https://blazor.syncfusion.com/documentation/datagrid/events#rowupdating

Regards,
Prathap Senthil



Marked as answer
Loader.
Up arrow icon