Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FormTabs does not retain form values upon navigating. #4353

Closed
AstroNet-K2 opened this issue Jan 24, 2020 · 5 comments
Closed

FormTabs does not retain form values upon navigating. #4353

AstroNet-K2 opened this issue Jan 24, 2020 · 5 comments

Comments

@AstroNet-K2
Copy link

We recently upgraded to 3.1. After going through upgrade docs and taking care of all changes, our application is showing this issue. We have multiple tabs in each form. If we fill in one tab and go to the other tab, the values from the previous tab are gone. Looks like upon navigating out and coming back to the tab again, the reload/reset of the form is happening. This is same with create and edit forms.
We looked for some documentation reference, nothing shows a lead to fix this issue.
Any help and suggestions asap are highly appreciated!

@fzaninotto
Copy link
Member

I can't reproduce the problem on the demo. Could it be related to #4066?

Also, please follow the issue template and provide a CodeSandbox showing the bug.

@AstroNet-K2
Copy link
Author

AstroNet-K2 commented Jan 28, 2020

What you were expecting:
We expect the tabbed form to retain the values entered while navigating across the tabs during filling in the form details before finally saving the form.


<Edit  title={<FormEditTitle />} actions={<BlankCardAction />} {...props}>
		<TabbedForm validate={validateForm}>
			<FormTab label="Basic Info">
				<TextInput source="name" label="Name"/>
				<TextInput multiline source="description" label="Description" />
			</FormTab>
			<FormTab label="Add/Edit More Info">
				<TextInput multiline source="description" label="Description"/>
			</FormTab>
		</TabbedForm>
</Edit>

What happened instead:
While navigating across the forms, the values keyed-in are not being retained and the form text boxes are becoming blank.

Steps to reproduce:

  • Follow the code above.
  • Fill in the values in the first tab and navigate to the second tab and fill in the values there.
  • Come back to the first tab and you will already notice that the entered values are gone.
  • If you go to second tab now, values there are also already gone.

Other information:
We see this issue only after trying upgrade to 3.1

Environment:
package.json is as below, and the other details follows (we are seeing same issue with 3.0.0).

  "dependencies": {
    "@material-ui/core": "^4.8.3",
    "@material-ui/icons": "^4.5.1",
    "@okta/okta-react": "^1.1.1",
    "@okta/jwt-verifier": "^0.0.12",
    "@okta/okta-signin-widget": "^2.13.0",
    "jspm": "^0.16.53",
    "npm-check": "^5.9.0",
    "ra-core": "^3.1.1",
    "ra-data-simple-rest": "^3.1.0",
    "ra-input-rich-text": "^3.1.0",
    "react": "^16.12.0",
    "react-admin": "^3.1.1",
    "react-dom": "^16.12.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.3.0"
  }

Last version that did not exhibit the issue (if applicable): 2.9.x, below is the dependencies list

  "dependencies": {
    "@material-ui/core": "^1.5.1",
    "@material-ui/icons": "^2.0.3",
    "@okta/okta-react": "^1.1.1",
    "@okta/jwt-verifier": "^0.0.12",
    "@okta/okta-signin-widget": "^2.13.0",
    "jspm": "^0.16.53",
    "material-ui": "^1.0.0-beta.47",
    "npm-check": "^5.9.0",
    "ra-core": "^2.3.3",
    "ra-data-simple-rest": "^2.3.3",
    "ra-input-rich-text": "^2.3.2",
    "react": "^16.5.2",
    "react-admin": "^2.9.0",
    "react-dom": "^16.5.2",
    "react-router-dom": "^4.2.2",
    "react-scripts": "1.1.4"
  }

Browser: Chrome
Stack trace (in case of a JS error):N/A

Will try to produce the Code Sandbox.

@AstroNet-K2
Copy link
Author

Each time we navigate between the tabs We are also seeing below warning on the DEBUG Console which was not showing up in 2.9.

Warning: You cannot change <Router history> tiny-warning.esm.js:11

Some sort of additional navigation and reload is happening for the forms which is resetting the form in each tab upon navigating.

Thank you!

@fzaninotto
Copy link
Member

Thanks for the precisions, but we can't test the code you pasted because it's not complete. Please provide a link to a CodeSandbox showing the issue, based on the Simple example.

I don't like to be this procedural, but since react-admin doesn't have this bug in the simple example, it means the bug appears in certain conditions. You have to isolate these conditions and prove the problem is on the react-admin side and not on your side. Otherwise, it's just troubleshooting, and we're not doing that here (see StackOverflow for troubleshooting).

Thanks in advance ;)

@fzaninotto
Copy link
Member

No news for some time, closing.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants