Moving rows while modifying data using inline editing

Hello

I can not speak English. So I use Google Translate.
Even if the explanation is not natural, I hope for your patience.

While modifying data using inline editing, if you select another row with the mouse, the existing modifications are saved.

Query 1 - I want to display a message to the user by catching the moment when another row is selected while editing
Query 2 - I want the user to see the message and choose yes/no to save or cancel editing.

I would appreciate if you can tell me how.

3 Replies 1 reply marked as answer

RN Rahul Narayanasamy Syncfusion Team September 21, 2020 12:25 PM UTC

Hi JaeHyeong, 

Greeting from Syncfusion. 

Query: Inlineedit - I want the user to see the message and choose yes/no to save or cancel editing. 

We have validated your query and you want to prevent the save operation and show the confirmation message while clicking other rows. Here, we have prepared a sample based on your requirement by using External Dialog and Grid events(OnRecordClick, OnActionBegin and OnToolbarClick events with a boolean variable). Find the below code snippets and sample for your reference. 

 
<SfDialog Width="250px" ShowCloseIcon="true" IsModal="true" @bind-Visible="@IsVisible">   // rendering the dialog while clicking other rows while editing 
    <DialogTemplates> 
        <Header> Confirmation </Header> 
        <Content> Do you want to save this record? </Content> 
    </DialogTemplates> 
    <DialogButtons> 
        <DialogButton Content="Save" IsPrimary="true" OnClick="@EndDialog" /> 
        <DialogButton Content="Cancel" OnClick="@CancelDialog" /> 
    </DialogButtons> 
</SfDialog> 
 
<SfGrid @ref="Grid" DataSource="@Orders" AllowPaging="true" Toolbar="@(new List<string>() {"Edit", "Delete", "Cancel", "Update" })" Height="315"> 
    <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Normal"></GridEditSettings> 
    <GridEvents OnActionBegin="ActionBegin" TValue="Order" OnRecordClick="RecordClickHandler" 
                OnToolbarClick="ToolbarClickHandler"></GridEvents> 
    <GridColumns> 
        . . . 
   </GridColumns> 
</SfGrid> 
 
@code{ 
    SfGrid<Order> Grid; 
    public List<Order> Orders { get; set; } 
    private bool PreventUpdate { get; set; }   //introducing Boolean value to achieve the requirement 
    private bool IsVisible { get; set; }     //for dialog showing and hiding 
    public bool IsAdd { get; set; } 
 
    . . . 
   private void ActionBegin(ActionEventArgs<Order> args) 
    { 
        if (args.RequestType == Syncfusion.Blazor.Grids.Action.Save && PreventUpdate) 
        { 
            args.Cancel = true; 
            OpenDialog(); 
        } 
   } 
    public void ToolbarClickHandler(Syncfusion.Blazor.Navigations.ClickEventArgs args) 
    { 
        if (args.Item.Text == "Update") 
        { 
            PreventUpdate = false; 
        } 
    } 
    public void RecordClickHandler(RecordClickEventArgs<Order> args) 
    { 
        PreventUpdate = true; 
    } 
 
    private void OpenDialog() 
    { 
        this.IsVisible = true; 
    } 
 
    private void EndDialog() 
    { 
        this.IsVisible = false; 
        PreventUpdate = false; 
        if (IsAdd) 
        { 
            Grid.CloseEdit(); 
            IsAdd = false; 
        } else 
        { 
            Grid.EndEdit(); 
        } 
    } 
    private void CancelDialog() 
    { 
        this.IsVisible = false; 
        PreventUpdate = false; 
        Grid.CloseEdit(); 
    } 
 
    . . . 
} 


Reference

Please let us know if you have any concerns. 

Regards, 
Rahul 
 


Marked as answer

JJ JaeHyeong Jang September 22, 2020 05:56 AM UTC

This works perfectly.
Thank you very much.


RN Rahul Narayanasamy Syncfusion Team September 23, 2020 05:14 AM UTC

Hi JaeHyeong, 
 
Thanks for the update. 
 
We are happy to hear that the provided solution was helpful to achieve your requirement. 
 
Please get back to us if you need further assistance. 
 
Regards, 
Rahul 


Loader.
Up arrow icon