I am currently trying to collapse the edit form from the list view in React-Admin after hitting the submit button. I want to be able to view those updated changed in the new list form after hitting submit as well.
Right now I have a class which handles when the form is submitted, and I am using window.location.replace('URL') within that class to try and redirect the page. The problem I am currently running into is that since I want the page to redirect to the same URL, It doesn't show the changes made and also doesn't collapse the edit form. When I use a different URL and go back to the list view it shows all the changes. So what I essentially want is to just reload the page (so everything is updated and the edit bar is collapsed) after the form is submitted. However, when I used window.location.reload(), it reloads the page immediately before saving any of the data from the edit form.
This is the code I currently have which handles submit:
const saveWithNote = (values, basePath, redirectTo) =>
crudCreate(
'usergrouprights',
{
...values,
GroupRights: CalcGroupPermissions(values).rights,
GroupDenials: CalcGroupPermissions(values).denials
},
basePath,
{
redirectTo
}
);
class SaveWithNoteButtonView extends Component {
handleClick = () => {
const { basePath, handleSubmit, redirect, saveWithNote } = this.props;
return handleSubmit(values => {
saveWithNote(values, basePath, redirect);
window.location.replace('/#/usergrouprights');
// window.location.reload();
});
};
render() {
const { handleSubmitWithRedirect, saveWithNote, ...props } = this.props;
return (
<SaveButton handleSubmitWithRedirect={this.handleClick} {...props} />
);
}
}
const SaveWithNoteButton = connect(
undefined,
{ saveWithNote }
)(SaveWithNoteButtonView);
export default SaveWithNoteButton;
In the list view, I have a custom toolbar which is the following:
const PostEditToolbar = props => (
<Toolbar {...props}>
<SaveWithRightsValuesButton />
</Toolbar>
);
When the code is run, It submits everything properly but I need to manually reload the page to view the changes and for the edit form to collapse as well. I am unsure if using the window.location.replace or reload call is the right idea as it is not working the way I would like it to at the moment.