Submit only Registered field

Hi, Is there an option to submit only values from registered fields?

I have a form which I initialize with data from my rest api. All the data from my API goes to the values as my form values event if I didn’t register all the field, then after submission I receive all the data in the handleSubmit method. is it possible to filter only values from field which was registered (i.e. in the form )?

Thank you

[henbjo]

I know this is an old post, but I thought I’d post a solution to this problem.

I solved this by selecting registeredFields from the form state, and piping the field names into a formValueSelector. The only thing I dislike about this solution is having to maintain the getRegisteredFields selector myself, as it will break if and when you decide to change the internal structure of the Redux Form state. Having the library provide this selector would be a good thing.

import React from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { reduxForm, formValueSelector, Field } from 'redux-form';

/* selectors */
const getFormState = state => state.form;
const getNamedFormState = formName => createSelector([getFormState], (formState = {}) => formState[formName]);
const registeredFieldsSelector = formName => createSelector([getNamedFormState(formName)], (namedFormState = {}) => namedFormState.registeredFields);

/* Form component */
const MyFormComponent = ({ handleSubmit, showB }) => (
  <form onSubmit={handleSubmit}>
    <Field name="A" />
    {showB && <Field name="B" />}
    <button type="submit">Submit</button>
  </form>
);

const MY_FORM_NAME = 'MyForm';
const getRegisteredFields = registeredFieldsSelector(MY_FORM_NAME);
const getFormValues = formValueSelector(MY_FORM_NAME);

const mapStateToProps = (state) => {
  // This is where the magic happens
  const registeredFields = getRegisteredFields(state);
  const registeredFieldNames = Object.values(registeredFields).map(rf => rf.name);
  const valuesForRegisteredFieldsOnly = registeredFieldNames.length
    ? getFormValues(state, ...registeredFieldNames)
    : {};
  return { valuesForRegisteredFieldsOnly };
};

const MyForm = connect(mapStateToProps)(reduxForm({ form: MY_FORM_NAME })(MyFormComponent));

/* Container component that uses MyForm */
const submitMyForm = (values, dispatch, { valuesForRegisteredFieldsOnly }) => (
  dispatch(mySubmitAction({ data: valuesForRegisteredFieldsOnly }))
);

const MyContainerComponent = () => (
  <MyForm onSubmit={submitMyForm} />
);

[henbjo]

@davepacifico Yes, like I said, that’s the only drawback with the solution as far as I can see. I don’t see a good reason why the library shouldn’t export this selector. If I can find the time I’ll whip together a PR.