redux-form: Not able to initialize form using redux immutable state

Any update on this ? Im facing the same issue. Values in store get completely messed up after I edit some field.

First render, fields are empty but store shows correct values:

Submitting like this sends the correct values from initial.

After entering “New name” in the name field.

_root has the same structure as @ppascher showed. Submitting sends that structure.

---

UPDATE: This might not be the same problem but it showed all the same consequences so might as well check it out. The problem in my code was using everything from 'redux-form/immutable' in the containers, but not importing the correct reducer. So now i changed to import { reducer as formReducer } from 'redux-form/immutable';

Strangely everything was working but the initialValues. On a side note, I had to change my submit functions and use .toJS() before sending the data.

I also had this issue. Solution was to import { reducer as formReducer } from 'redux-form/immutable' , previously I was importing the reducer from redux-form

Finally got it to work (but with a props warning) using import { reducer as formReducer } from 'redux-form/immutable'; in the combineReducer({...}) file and using import { Field, reduxForm } from 'redux-form/immutable'; in my container.

But I had to use a trick too, in my container’s reducer, I have my const initialState = fromJS({ info: false, loading: false, error: false });. If I have info: fromJS({}) to initialize my substate that will contain all the fields data after fetching from api, the initialize action of redux-form is never triggered, but if I do info: false in the initialState of the reducer, I have the React warning Warning: Failed prop type: Invalid prop initialValuesof typebooleansupplied toForm(Profile), expected object. which is normal since it should not be boolean but the values are well initialized from Redux-form and can be edited.

@ppascher @erikras I have the same issue

I have the same issue. I pass an “initialValues” object to my form together with “enableReinitialize”.

Component gets mounted, triggers an api call to load data and I can see in DevTools that “redux-form/INITIALIZE” gets called afterwards and the state in “form -> formname -> values / initial” is populated. Submitting the form uses those values but they are never rendered.

I use redux-form/immutable and I use a custom Field component to use react-bootstrap:

const InputTextRedux = (props) => {
  return (
    <div>
      <FormGroup
        className={props.groupClassName ? props.groupClassName : ''}
        name={props.name ? props.name : ''}
      >
        <ControlLabel
          className={props.labelClassName ? props.labelClassName : ''}
        >
          {props.label ? props.label : 'Text'}
        </ControlLabel>
        <InputGroup
          className={props.wrapperClassName ? props.wrapperClassName : ''}
        >
          <InputGroup.Addon className="input-group-addon">
            <i className={props.icon ? props.icon : 'fa fa-pencil'} />
          </InputGroup.Addon>
          <FormControl
            disabled={props.disabled ? true : false}
            id={props.id ? props.id : props.name}
            onChange={(event) => {
              props.input.onChange(event.target.value);
            }}
            placeholder={props.placeholder ? props.placeholder : ''}
            type={props.type ? props.type : 'text'}
            value={props.input.value}
          />
          <FormControl.Feedback />
        </InputGroup>
      </FormGroup>
    </div>
  );
};

The problem to me was that my reducer didn’t use redux-form/immutable Pls double check it if you are using immutableJS. Got stuck for half a day because of this… I feel I am so dumb 😦

I’m also having the same issue, using immutable. I’m passing the values down using props though.

const initialValues = {
    name: 'Hello world',
};

<ReduxForm initialValues={initialValues} />

redux-form/INITIALIZE

But nothing gets rendered

@maxtechera Have been wasted my afternoon trying to figure out why. Thanks for saving my night

@ppascher I have the same behavior

But after importing from redux-form/immutable I am getting

Module not found: Can’t resolve ‘immutable’ in ‘D:\gift_savvy_client\node_modules\redux-form\lib\structure\immutable’

@marcpeters2 thanks brooo, working

i had the same issue, redux-form/immutable was the solution as stated before. I believe a warning should be fired if there is some inconsistency when using a mixture between immutable and mutable stuff.

Did you get the initialValues working?

Both options are not working.

Update:

It does work but i forgot to attach values to my input field.

const initVal={
name: 'init value',
}
<FormEventcreators initialValues={initVal} />

That works for me (with redux-form immutable)

Thanks @crazymunky. I was also importing the wrong reducer and switching + adding .toJS() to my submit functions solved my problem.