We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to confirm row edit

I have a grid in which i am enabling row edit. When i add a new row (the datasource is a local JS list of objects) and i want to confirm the newly added row, i cannot.
In other words, i am stuck in edit mode. If i press escape, the row get discarded and deleted. But no matter what i press (Enter, Ctrl + Enter, Shift + Enter) i am stuck in edit mode, unless i click on another row and then the newly added row get confirmed and added to the datasource.

Note:
If i click anywhere else other that another row, the newly created row won't get added to the datasource. For example, if when i'm done editing and i click on the save button, the newly created row won't get added to the datasource and it won't get sent to the server.

The same goes for editing existing rows wether on double click or on pressing F2.

PS: I have a "IsPrimaryKey" column.

Can you please show me how to confirm row editing ?

Thank you in advance.

2 Replies

FH Fayçal HANNOUN December 15, 2019 10:30 PM UTC

I figured it out.

I used the keyPressed event and used the endEdit method of the grid. Here is the code

function gridInvoicesKeyPressed(e) {        
        if (e.code === "Enter") {
            let grid = document.getElementById('grid-invoice-lines').ej2_instances[0];
            if (grid.isEdit)
                grid.endEdit();
        }
    }

Thanks to the code example "Enable single click edit" otherwise, i wouldn't have been able to figure it out only by reading the documentation since the method is nowhere to be found !

I think the documentation could explain a little bit more what each method does and if possible, give some use case examples (one or two chould be enough).
Anyway, i posted the answer in case someone would find it useful in the future.

Thank you and please enhance the documentation.


SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team December 16, 2019 12:34 PM UTC

Hi Fayçal, 

We could see you would like to access the Grid functionalities using the keyboard navigation. Somehow, you have managed to achieve the requirement. However, we have provided default support for the keyboard actions in the Grid. Refer to the following code example.  


Regards,  
Seeni Sakthi Kumar S 


Loader.
Up arrow icon