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

Edit view submits form values even if inputs with that source don't exist #2414

Closed
Gonusi opened this issue Oct 11, 2018 · 3 comments
Closed

Comments

@Gonusi
Copy link

Gonusi commented Oct 11, 2018

What you were expecting:
<SimpleForm> in <Edit> view submits the values of the inputs it contains.

What happened instead:
If my API returns this on GET /products/1:
{ id: '1', name: 'pizza', size: 'large' }

My Edit view form submits all the same values, even if there is only a single <TextInput source='name'/> component on that form:
<Edit {...props}> <SimpleForm> <TextInput source='name' /> </SimpleForm> </Edit>

This causes the API to reject the request since it only expects name value on PUT.

Steps to reproduce:

  1. Configure an API to send the response to GET as shown above.
  2. Create an Edit view with a SimpleForm and a single .
  3. Open the Edit view.
  4. Inspect the redux state - form values are already populated with all the values received from the GET request that is performed before the form renders.
  5. Submit the edit form.
  6. Check the network tab - all the values seem to be submitted, even for non existing inputs.

Environment

  • React-admin version: 2.3.3
  • React version: 16.5.2
  • Browser: Chrome 66.0.3359.139 (Official Build) (64-bit)
@fzaninotto
Copy link
Member

That's by design. If you want to send only the values that changes to your API (in a PATCH rather than a PUT), you need to compute the diff in your dataProvider (using previousData, already in the payload) and send only this diff.

@Gonusi
Copy link
Author

Gonusi commented Oct 11, 2018

Thanks for the clarification. Best of luck !

@digitalbase
Copy link

I was doing this with some code like

 case UPDATE:
            let params_to_patch = {};
            for (let [key, value] of Object.entries(params.data)) {
                if (key === 'version') continue;
                if (key === 'updated_at') continue;


                if (params.previousData[key] !== value) { //only works for primitives
                    params_to_patch[key] = value;
                }
            }

            return {
                url: `${API_URL}/${resource}/${params.id}`,
                options: {method: 'PATCH', body: JSON.stringify(params_to_patch)},
            };

The problem with this is that it still patches properties that are not in the form (like version, updated_at, and other properties coming from the API).

Is there any way to excluded them? Like filter them by the available form elements ?

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

No branches or pull requests

3 participants