B_McG B_McG - 1 year ago 598
React JSX Question

Redux Form - initialValues not updating with state

I am having some issues with setting the inital form field values using redux-form.

I am using redux-form v6.0.0-rc.3 and react v15.3.0.

So here's my issue, I have a grid of users and when a user row is clicked on, I am navigating to an edit users page and including the users id in the url. Then on the edit users page, I am grabbing the id and calling fetchUser(this.props.params.id) which is an action creator that returns this.state.users. I am then attempting to set the forms inital values by calling:

function mapStateToProps(state) {
return { initialValues: state.users.user }

By my understanding, this should set the initialValues to state.users.user and whenever this state is updated the initialValues should be updated as well. This is not the case for me. InitialValues is being set to the previously clicked on user row (i.e the previous state for this.state.users.user). So I decided to test this and add a button to this component and when its clicked I am calling fetchUser again with a user id hard coded in:


This is updating the state correctly but the values for initialValues do not change. It is not getting updated when the state is updated. I tested this exact same process on an older version of redux-form and it worked as expected.

Am I doing something wrong here or is this an issue with the version I am using.

Users Edit Form -

class UsersShowForm extends Component {

componentWillMount() {


changeUser() {

renderTextField(field) {
return (
errorText={field.touched && field.error}

render() {
const { handleSubmit, submitting, pristine } = this.props;


<form onSubmit={handleSubmit(this.onSubmit.bind(this))} className="mdl-cell mdl-cell--12-col">

<Field name="emailAddress" component={this.renderTextField} label="Email Address"/>

<Field name="firstName" component={this.renderTextField} label="First Name"/>

<Field name="lastName" component={this.renderTextField} label="Last Name"/>

<RaisedButton onClick={this.changeUser.bind(this)} label="Primary" primary={true} />


function mapStateToProps(state) {
return { initialValues: state.users.user }

UsersShowForm = reduxForm({
form: 'UsersShowForm'

UsersShowForm = connect(

export default UsersShowForm

Users Reducer -

import {
} from '../actions/types';

const INITIAL_STATE = { all: [], user: {} };

export default function(state = { INITIAL_STATE }, action) {
switch (action.type) {
return {...state, all: action.payload };
return {...state, user: action.payload };
return state;


Reducer Index -

import { combineReducers } from 'redux';
import { reducer as formReducer } from 'redux-form';
import usersReducer from './users_reducer';

const rootReducer = combineReducers({
form: formReducer,
users: usersReducer

export default rootReducer;

Answer Source

I was facing the same problem after update to redux-form v6.0.0-rc.4.

I solved setting enableReinitialize to true

UsersShowForm = reduxForm({
  form: 'UsersShowForm',
  enableReinitialize: true
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download