I am trying to create custom checkbox edit on modal editing mode, but I can't fine the way to update the row data with the new chekbox state.
I have this custom component:
import { Checkbox, FormControlLabel } from "@mui/material"
import React from "react"
const EditCheckbox = (props: any) => {
const [isChecked, setIsChecked] = React.useState(props.cell.getValue())
return (
<FormControlLabel
key={props.column.id}
control={
<Checkbox
name={props.column.id}
checked={isChecked}
value={isChecked}
onChange={(e) => {
setIsChecked(e.target.checked)
}}
/>
}
label={props.column.id}
/>
)
}
export default EditCheckbox
and this column settings for material react table:
const columns = [
{
accessorKey: 'email',
header: 'Email',
Edit: (props) => <EditCheckbox {...props} />,
},
];
on the UI everything is working just fine. but when I am saving the edit the value of the checkbox is not changing at all.
older version has props.onChange() but I can't use it on version 1.8.5. the function is not exists on props.
anyone can help me find a solution?
thanks :)
I am trying to get the edit changes from the modal after use custom edit on material reacl table.