Only send data that has form inputs in edit

Question

React admin does not respect the form inputs that are actually in the form when submitting data. It will instead send the entire record that was initially fetched, regardless of which inputs are actually in the form.

How can I just send the data that has inputs displayed in the form?

Example: Given the following record fetched for the edit form:

{ first_name: 'jane', last_name: 'doe', age: 21, email: '[email protected]' }

The form will only have inputs for first_name and last_name. I want the form to only submit data to the following inputs: first_name, last_name.

Answer 1

You can use the _pick from underscore.js

pick({ first_name: 'jane', last_name: 'doe', age: 21, email: '[email protected]' }, 'first_name', 'last_name')

Answer 2

Setting the following props on the react admin SimpleForm fixed the problem.

  destroyOnUnregister={true}
  sanitizeEmptyValues={false}

This in addition to using react-final-form useForm allowed me to dynamically add and remove inputs via the change method: form.change(inputName, undefined) and thus prevent them from being submitted.