Add Cell Edition in Data Grid with good keyboard accessibilty for edition and refresh must be optimazed

[Cesar Smerling]

Hi!

1. I'm opening this ticket to ask for Cell Edition mode in the Data Grid. Now I have a workaround with the Batch Edit mode, but is not so clean solution.

2. Another thing is the keyboard accessibilty, my main problem is the "refresh" of the rows because in my case when I edit a cell that value is send to to a server, and the server respond with a new array (my data source is an array) so the grid detect that change and "refresh" all the rows. Maybe you could add some optimization that when refresh reflect the changes (add, remove, value edited in a row) not refresh the entire table, like Ag-Grid does. Or maybe I missed and there is a better way that refresh all the array?. https://www.ag-grid.com/javascript-grid-refresh/

3. This refresh process complicates the reselection of the row because I need to save the last selected row and select on dataBound again. This producces some bad UX. What the user see is: leaving the edit mode, refresh the row, enter the edit mode (I shared a video of this). Maybe there is a way to send the value to before leaving the edit mode?. (I share a video of this refresh)

4. The other thing is to maintain the tab, shift+tab, enter and shift+enter to enter edit mode and the arrows to move around outside the edit mode. I found that the grid create some different selection with the rows that with the click, and  tab, enter (in edit mode) doesnt select the row. So that complicates to get the latest selected row.

I manage to get it working on my example, but this solution is not reliable, now I need to create something to extend to all of the grids in our app. So I'm asking that this things must be implemented, it's the very basic of any grid I thing.

Attached is the code of my component grid and a video showing the "refresh" and the reselection after refresh.

Thanks

Attachment: dataGrid_5f70caf7.7z

[Praveenkumar Gajendiran]

Hi Cesar,

Thanks for contacting Syncfusion support.

We checked your query and provided video. Based on that we would like to inform you that by default, you can bulk edit,  bulk add or bulk delete a record at the same time when using Batch edit mode. You can preform bulk CRUD operation. For this case entire Grid dataSource will be changed while preforming edit, add and delete operations, that’s why we refresh the entire Grid data that time.

For this case, please confirm at your end- “you do not want to add and delete a record in the Grid. You can only do edit action in the Grid”.

Based on your video demonstration, we suspect that you have preformed some customization in the Grid. Because by default when we update the edited cell, it turns green until the value saved in the Grid. But in the video, the cell does not turns green when you update. So please share what are the customization did you preformed in the grid?

Please get back to us with the requested details to proceed further.

Regards,
Praveenkumar G  

[Cesar Smerling]

Hi, I use the batch edit mode like a "cell edition" like mentioned in this post.

https://www.syncfusion.com/forums/157807/data-grid-have-no-cell-edit-mode

This workaround complicates things (re selection mentioned before and customization of the component inside the edit mode and keyboard), but I managed to get it working that's why you don't see the green of the batch, because I remove it to simulate a "Cell Edition" like Tree Grid.

I confirm that the updates from the server make updates on the cell but sometimes removes and add rows. I know that the grid for that needs refresh, that's why I'm asking to review this, like Ag-Grid provides or Wijmo Grid a refresh method that re select the row and gives good UX like mentioned in 3.

Thanks

[Praveenkumar Gajendiran]

Hi Cesar,

Thanks for your update.

We have created a new incident under your Direct trac account to follow up with this query. We suggest you to follow up with the incident for further updates. Please log in using the below link.      

https://www.syncfusion.com/account/login   

Regards,
Praveenkumar G