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

Having trouble Updating an item with react-admin < Edit/> component #5082

Closed
Jack-B-Lenihan opened this issue Jul 23, 2020 · 7 comments
Closed

Comments

@Jack-B-Lenihan
Copy link

What you were expecting:
Upon hitting the edit button on a list item the edit component properly renders with all the correct data for the item passed into its form. When I edit a field and hit save I expected the dataprovider.update() method to create the request and send it to the update route handler I'd written on the backend. Then either successfully update the product or provide some relevant error message.

What happened instead:
When the save button is hit I see in my server that the route handler for getOne is firing. I understand that getOne is called for rendering the edit component but I did not think it is supposed to fire for the save function. Also, the onSuccess function on the comp (copied from docs) throws an err in the js console saying that it's data prop is undefined. Meanwhile the save button stays permanently pressed down with a loading symbol on it and the browser tab.

Steps to reproduce:

  1. start up the app by running npm run buil, npm run server then go to http://localhost:5000/admin#/admin-products. You must be on react-admin branch (git checkout react-admin). Also, you must rebuild and restart the server after every change.
  2. click the show button on one of the items in the list
  3. click edit in top right corner of the show comp
  4. edit one of the fields and hit save
    You will see the getOne route handler firing in the server and the onSuccess func throw it's error in the js console in Chrome

Git clone link: https://github.com/cbddy/wholesale-portal.git

relevant files:
frontend

  • src/components//adminSetup/dataProvider.js
  • src/components//adminSetup/Setup.js
  • src/components//adminSetup/MenuItems/Products.js
    backend
    -server/server.js
    -server/admin-routes/admin-product.router.js
  • React-admin version: 3.7.0
  • Last version that did not exhibit the issue (if applicable):
  • React version: 16.13.1
  • Browser: Google Chrome
  • Stack trace (in case of a JS error): ?
@Luwangel
Copy link
Contributor

Hi,

Thank you for opening this issue 🙏

I need to reproduce the problem you describe in order to fix it quickly. But I can't use your repository which is private.

As explained in the bug report template:

  1. Please fork the following template on CodeSandbox : React Admin Template
  2. Reproduce your bug. Remember to give us the clearest and simplest example possible.
  3. Reply to this issue with the link of your CodeSandbox, and extra information if it's necessary.

Regards,
Adrien

@numtel
Copy link

numtel commented Jul 29, 2020

I was able to recreate this in a fresh create-react-app available here: numtel/react-admin-demo-5082@3b5c56f

In this example, 2 different react-admin instances are created inside of a react-router.

On the component exported from admin.js and mounted at /admin, the update and delete events are never invoked on the [extremely bare-bones] dataProvider.

On the other instance mounted at /other-admin, the same [duplicated] code is used but it is supplied as children to the <Route> component instead of as the component attribute.

There's not enough information from the original post to say that this is the same reason why @Jack-B-Lenihan had this problem but this seems to fix it in my case.

@InfiniteRandomVariable
Copy link

InfiniteRandomVariable commented Aug 5, 2020

Experience the same problem described by @Jack-B-Lenihan.
I wrote the GetOne specifically just to comply to the doc. But the SaveButton doesn't call the DataProvider.update.

I follow this tutorial.
https://marmelab.com/blog/2019/02/07/react-admin-advanced-recipes-creating-and-editing-a-record-from-the-list-page.html
The demo for this tut works but it isn't using the latest version and written in 2019.

I'm writing a sample case on https://codesandbox.io, pls allow 24 hours.

@InfiniteRandomVariable
Copy link

Follow this link.
https://codesandbox.io/s/loving-voice-qvtdk?file=/src/posts/PostList.js

  1. Click PostList
  2. Select "Edit" Button in one fo the rows on the PostList-> The Drawer would appear,
  3. Type something on the field and press save or edit.
  4. Expecting to send a request to DataProvider.update. But no response whatsoever on the console. The transform prop on the Edit component is not being called.

Thanks for the help!

@fzaninotto
Copy link
Member

This is not demonstrating a bug in react-admin, but a problem you're having integrating it. What you are trying to do is actually possible with react-admin (see the reviews list in the e-commerce demo, https://marmelab.com/react-admin-demo/#/reviews), so the problem lies in your code.

So this issue lies in the category of "how to / troubleshooting", which should be asked on stack Overflow rather than here.

@ssaric
Copy link

ssaric commented Oct 29, 2020

If anybody is looking for a solution, for some reason undoable in edit is causing problems. Set it to false, and update endpoint will get called. Don't know whats going on, I am trying to put this component under a special endpoint, and the parent app is managed with MobX so for some reason it might conflict, but after good 5h I finally got the update to work properly.

@crates
Copy link

crates commented Nov 5, 2021

Yep, I had the exact same issue - thanks very much for calling that fix out, @ssaric! It worked great for me.

One of my edit views was freaking out when I tried to save. This was specific to a data type that I've termed "Roles".

Problem #1: When trying to save, no GQL call is issued. However, the local cache IS updated, so the List view for that record type looked just fine, BUT, I was also having a new issue...

Problem #2: After clicking save on the record in question, and returning to any other List views I looked at, after the bug manifested, all of the other List views are now showing the WRONG data type. I have data types like Policies, Views, Menus, and Content, to name a few. Once this issue manifested (ie. after clicking Save on the Roles data type), every other List view only shows me data from Roles and not from their proper data source.

@fzaninotto:
I know you're saying this is an implementation issue, and perhaps that is true, but the fact that I'm experiencing the identical issue to the others in this thread and that I was ALSO able to fix it solely by changing undoable to false in the Edit component makes it really seem like a bug to me. Oddly, none of my other data types have this issue... but the Roles views I'm using are instrumented slightly different in that I have a tabbed view for them, so this may indeed be an implementation issue. It seems to act a lot like a bug, though...

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

7 participants