You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
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:
Configure an API to send the response to GET as shown above.
Create an Edit view with a SimpleForm and a single .
Open the Edit view.
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.
Submit the edit form.
Check the network tab - all the values seem to be submitted, even for non existing inputs.
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.
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 ?
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 onPUT
.Steps to reproduce:
GET
as shown above.Environment
The text was updated successfully, but these errors were encountered: