Can't get onChange event for non-text input types about fluentuieditabledetailslist

[kushalmehrotra713]

Hi @akgitrus
Thanks for pointing out the bug regarding column onChange. I have just checked-in the code to add support to other EditableControlType types like Dropdown, Date & TagPicker. For the implementation, please check the commented code in 'attachGridValueChangeCallbacks' function in gridconsumer.tsx file. Do let me know if this solves your issue.

Regarding your second question for onChange, column level onChange is just meant to be a callback when the user is making any live changes, where it sends you back the live changes in grid data, even if the user hasnt saved those. This implementation was provided to give control to the user to implement their custom functionality on the grid data if need be.
An example of that would be 'Showing Summation of any number column'. In this case, user may want the summation to be live as he/she edits the values in the number column.

As for your requirement, where you need to push values to backend, column level onChange will not be the right choice.
What you need is 'onGridSave' callback function. You can check the implementation for the same in onGridSave function in gridconsumer.tsx file.

onGridSave gets fired when the user clicks on the 'Submit' button in the grid. The function callback receives entire Grid data. If you need to identify the rows that you have updated, you can use 'grid_row_operation' property in the data like this:-
data.filter(item => item.grid_row_operation == Operation.Update)
Same way you can filter for both Added and Deleted rows as well.

I have updated the onGridSave function to show these implementations as well.

You can refer the same in this PR:-
#48

Please do let me know if this solves your problem.

[akgitrus]

Hi Kushal, thank you for quick response and fix! I think it solves my current issue.

Regarding the column's onChange - it is more clear now after your explanation. But consider my idea, may be for future releases, - I didn't want to use the "Submit" button at all - to make the UI more concise and save changes on-the-fly as the user make their input.

Anyways, now I'm ok. Thanks again, appreciate your help.

[kushalmehrotra713]

Hi Kushal, thank you for quick response and fix! I think it solves my current issue.

Regarding the column's onChange - it is more clear now after your explanation. But consider my idea, may be for future releases, - I didn't want to use the "Submit" button at all - to make the UI more concise and save changes on-the-fly as the user make their input.

Anyways, now I'm ok. Thanks again, appreciate your help.

Hi @akgitrus . Point taken. I can consider adding that functionality based on a configuration. May be not triggering onGridSave callbacks as and when the user is typing but when the user is done with on-the-fly changes and wants the grid to auto-reconcile(i.e. without having to explicitly click on the 'Submit' button). Thanks for the feedback.

Since your issue is resolved, I'll close this thread but do feel free to open more issue threads as and when you face any challenges and I can help resolve those. Thanks.