Open perfectstrong opened 5 years ago
Updates to the table data are complex because the data is restructured and re-built before being placed into the table, meaning that it has to move through this process for the update to occur in the table (even though the state will change regardless). For now, it will be best to use options like customBodyRender
, which exposes a updateValue
function that will handle updates to your data by hooking into this process.
Then does customBodyRenderer
is common between rows or columns ? So that i can reuse in global.
You can use it that way if you want, and actually, you may not even need to use updateValue
, because the render function will be integrated with the table, so it should trigger the state updates you're looking for.
You can experiment with this example, that makes updates to the data directly in the "Delete" button: https://github.com/gregnb/mui-datatables/blob/master/examples/custom-action-columns/index.js. If you modify that code to change all the rows, it should also work.
Another experiment you can try is with the customToolbar
which will let you add buttons and functions that impact the overall table data.
You can use it that way if you want, and actually, you may not even need to use
updateValue
, because the render function will be integrated with the table, so it should trigger the state updates you're looking for.You can experiment with this example, that makes updates to the data directly in the "Delete" button: https://github.com/gregnb/mui-datatables/blob/master/examples/custom-action-columns/index.js. If you modify that code to change all the rows, it should also work.
Another experiment you can try is with the
customToolbar
which will let you add buttons and functions that impact the overall table data.
Yes yet if you use customToolbar
then use a modal to input data, then on the modal to save the input data for instance I am using an array of objects.
this.setState({rows: displayData[idx]["Freeform Notes"] = `${this.state.noteText}`
It will update programmatically yet not on the table. I am using my phone at the moment. I will provide additional and more specific information when I get to a computer. 👉🏻
@HeavenlyEntity, @perfectstrong It's possible that your issue is the way you are attempting to update state. You may have an object reference issue. I describe that class of mistake here https://github.com/gregnb/mui-datatables/issues/1082.
I have a table of objects
this.state.rows
to be rendered into an interactive data table that allows user to modify a certain field. When user clicks on a row, my custom dialog will show up and ask information. When user accepte it, I modify the data bythis.setState({rows: newRows})
. The problem is no rerender occurs and the table remains unchanged.Expected Behavior
The table updates as new data is pushed into.
Current Behavior
The table remains unchanged.
Steps to Reproduce (for bugs)
I simplify the step of showing dialog and mutating data. Just click the button "Change data" and all values of the first column will be appended "1". https://codesandbox.io/s/yjv1o52o7z
Your Environment