Only save the edited row when I click on save icon

[Luis Carlos]

Hi!

I realise when I'm editing a row and click on another row, the ejgrid component save the row that I was editing. I would like to change the behaviour, I mean, when I'm editing a row and click on another row, the ejgrid component cancel the row that I was editing. 

How can I do it? I mean, I just prefer to save the edited row only if I click on the save icon.

I will be awaiting for your reply, thanks in advance.

Regards, Luis.

[Vignesh Natarajan]

Hi Luis, 

Thanks for using Syncfusion products. 

We have analyzed your query and we have achieved your requirement through rowSelecting Event and cancelEdit() method of Grid. 

Refer the below code snippet 

$(function () { 

            $("#Grid").ejGrid({ 

                // the datasource "window.gridData" is referred from jsondata.min.js 

                dataSource: window.gridData, 

                allowPaging: true, 

                rowSelecting: function(args){ 

                   this.cancelEdit(); 

                }, 

                editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true }, 

        

For your convenience we have prepared a JSplayground sample  

Sample: http://jsplayground.syncfusion.com/qekq3rqo  

Refer our online documentation for your reference 

https://help.syncfusion.com/api/js/ejgrid#methods:canceledit  

https://help.syncfusion.com/api/js/ejgrid#events:rowselecting 

Regards, 

Vignesh Natarajan 

[Luis Carlos]

Hi again.

It doesn't work perfectly. 

I mean, when I'm editing a row and click on another row it cancels what I was editing, however it doesn't finish being selected.

Is there another way?

Thank you for your reply, I will be awaiting for your next reply.

Regards, Luis.

[Vignesh Natarajan]

Hi Luis, 

We suspect that you want to maintain selection of the edited row even after the editing is canceled. We have achieved this requirement by setting the args.cancel as true in the RowSelecting event of the Grid. 

Refer the below code snippet 

$(function () { 

            $("#Grid").ejGrid({ 

                // the datasource "window.gridData" is referred from jsondata.min.js 

                dataSource: window.gridData, 

                allowPaging: true, 

                rowSelecting: function(args){ 

                    if(this.getContentTable().find(".e-editedrow").length){  // tochecke whether the edit  form appears in the Grid 

                             this.cancelEdit();  // to cancel the editing  

                             args.cancel = true; // to prevent the row from being selected 

                 } 

               }, 

For your convenience we have prepared a JSplayground sample  

Sample: http://jsplayground.syncfusion.com/mqnk4od2   

Refer our online documentation for your reference 

https://help.syncfusion.com/api/js/ejgrid#events:rowselecting  

If we misunderstood your query please get back to us with more details 

Regards, 

Vignesh Natarajan