I have a requirement to implement an editable master-detailgrid.
After updating a child-record, the master needs to be updated. The update is triggered by tabbing out of the current cell. Then the sum is calculated and updated in the master-grid.
My problem is, that after updating the master-grid , the child looses its focus.
Here is a simplyfied version of my project:
Any help would be appreciated.
This is expected as the Grid has no built-in navigation on tap.
They have to be handled by the developer on the onKeyDawn event by placing the next editable cell in edit. A possible approach is shown here:
We are also working on extending the new keyboard navigation feature to make this easier to achieve.
Also, in functional components when passing props between components we recommend using React.Context as using functions we always re-mount them:
For example here, we recommend passing the extra information via React.Context instead of using an extra function:
const renderers = new Renderers(enterEdit, exitEdit, 'Value');
Currently, our avaialbe sample application has only single-level Grid or noneditable ones:
We have one example that shows how to pass extra props to cells using React. Context. The example is for single-level editing, but it can be used as a reference to how to utilize React.Context: