Access to Grid state about fluentuieditabledetailslist

[kushalmehrotra713]

Hi, Keeping in mind issue56 I would like to have an access to Grid state to use it in other component and which will re-render it when I save data in grid. How can I achieve this? Regards

Hi @Krugerro
If I understand correctly, you want to have access to Grid State(items in the Editable Grid) whenever you update something on the Grid.
Also, I am assuming by 'Save', you are referring to the action of updating something on the grid(without clicking the 'Submit' button).

Are these assumptions correct?

[Krugerro]

Hi @kushalmehrotra713
You understood me well and your assumptions are correct.

[kushalmehrotra713]

Hi @Krugerro
Please find the below PR that addresses this issue.
#73

Look for onGridUpdate function in GridConsumer.tsx to see how you consume the data from the callback. Dont forget to add onGridUpdate property when calling the Grid.

[Krugerro]

Works like a charm after single row update and row add 👍. Fails when item is deleted: onGridUpdate is fired but in callback data is still same length (this attribute I tested) and other component does not re-render and data change is not reflected. Please check on this. Thanks.

[kushalmehrotra713]

Works like a charm after single row update and row add 👍. Fails when item is deleted: onGridUpdate is fired but in callback data is still same length (this attribute I tested) and other component does not re-render and data change is not reflected. Please check on this. Thanks.

Hi @Krugerro
That is by design. You may want to filter the returned items by _grid_row_operation_ == Operation.Delete in order to get the deleted rows.

Reason:-
When you delete an item in the grid, the Grid only does a 'soft delete' i.e. it just marks the _grid_row_operation_ attribute for that row to 'Operation.Delete'. It does not physically delete the row from the data structure. Because, as a user, when you delete the row from the grid, you may want to reconcile that same in the backend(if the data is powered from a backend). For that, you would need to send the identifier of the deleted rows to the backend. Hence, the returned rows contain the deleted rows as well, marked with 'soft delete'.

Now coming to your issue. As I understand, you may be re-rendering the other component based on the length of the current grid data. Instead of that, you can filter the grid data based on different Operations(Update, Add, or Delete) and use those to re-render the other component.

Hope this helps.

[Krugerro]

That makes complete sense and I will use it while updating data in backend - thought I would have to "calculate" changes by my own now I see everything is included.
Thank you @kushalmehrotra713 very much for updates and explanation.

[kushalmehrotra713]

Thanks @Krugerro
Glad that it helped. 💯
Closing the issue.