You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I followed the CRUD example to have inline editable rows for my table. It works great but I needed to implement the functionality for saving when the user pushes enter and cancelling when the user pushes escape. I ran into a few problems.
Firstly, if you use onKeyPress or onKeyUp, it doesn't work at all. (incidentally, if I use onKeyUp for my callback and then put some console logs for onKeyDown and onKeyPress, it actually does work, which makes me think there's some race condition going on) What happens is the input gets defocused and the callback is never called. However, using onKeyDown works without problems.
But then you come to the issue that there are no save or cancel functions provided (unnless I have overlooked something).
For cancel, it's not such a big deal, because you can easily do table.setCreatingRow(null) or table.setEditingRow(null), depending on table.getState().creatingRow or table.getState().editingRow, even though this is a bit uncomfortable.
For saving, it's simply not possible. I initially tried getting the values from the row cache and doing the same thing as well cancel, but it doesn't seem to do the same things as when the user clicks the actual save button (e.g. the loading bar does not activate). The values are also not up-to-date (although, this can be mitigated by calling blur on the input). We also don't have access to exitCreatingMode anywhere other than from onCreatingRowSave, as far as I know.
In the end, my solution was to find the save button in the same row and call blur() followed by click(), to simulate a user click. This is definitely a dirty hack, but it's the only way I could think of doing it.
I can see how it's not straightforward to implement this functionality (for example, I left it out of the cell with a select, since escape and enter already do other things in a select), but I would expect some easier way to save or cancel programmatically, rather than only relying on the user physically clicking the buttons.
Maybe a cancel and save function could be exposed via the row object?
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I followed the CRUD example to have inline editable rows for my table. It works great but I needed to implement the functionality for saving when the user pushes enter and cancelling when the user pushes escape. I ran into a few problems.
Firstly, if you use
onKeyPress
oronKeyUp
, it doesn't work at all. (incidentally, if I useonKeyUp
for my callback and then put some console logs foronKeyDown
andonKeyPress
, it actually does work, which makes me think there's some race condition going on) What happens is the input gets defocused and the callback is never called. However, usingonKeyDown
works without problems.But then you come to the issue that there are no save or cancel functions provided (unnless I have overlooked something).
For cancel, it's not such a big deal, because you can easily do
table.setCreatingRow(null)
ortable.setEditingRow(null)
, depending ontable.getState().creatingRow
ortable.getState().editingRow
, even though this is a bit uncomfortable.For saving, it's simply not possible. I initially tried getting the values from the row cache and doing the same thing as well cancel, but it doesn't seem to do the same things as when the user clicks the actual save button (e.g. the loading bar does not activate). The values are also not up-to-date (although, this can be mitigated by calling blur on the input). We also don't have access to
exitCreatingMode
anywhere other than fromonCreatingRowSave
, as far as I know.In the end, my solution was to find the save button in the same row and call
blur()
followed byclick()
, to simulate a user click. This is definitely a dirty hack, but it's the only way I could think of doing it.I can see how it's not straightforward to implement this functionality (for example, I left it out of the cell with a select, since escape and enter already do other things in a select), but I would expect some easier way to save or cancel programmatically, rather than only relying on the user physically clicking the buttons.
Maybe a cancel and save function could be exposed via the
row
object?Beta Was this translation helpful? Give feedback.
All reactions