title: Redux form - Initial values not loading in the form
body: <p>Novice at this.</p>
  
  <p>I have a rather long form which is used as an edit form for changing a client details. The form loads but does not load with any values.  It was advised to hard code some values for fields eg "foo" and "bar" and doing this I get these strings in the text fields.</p>
  
  <p>Here is my code at the end of the form for hardcoding initial values that work:</p>
  
  <pre><code>    let ClientForm = reduxForm({
      form: CLIENT_FORM_NAME,
  
    })(Client)
  
          ClientForm = connect(
            state =&gt; ({
               initialValues: { account: 'foo', bsb: 'bar', }
            }),
            { reducer } // bind client loading action creator
          )(ClientForm)
  
    export default ClientForm
  </code></pre>
  
  <p>However if I use the following code nothing happens even when "state.editClient" has the values.</p>
  
  <pre><code>      let ClientForm = reduxForm({
      form: CLIENT_FORM_NAME,
  
    })(Client)
  
          ClientForm = connect(
            state =&gt; ({
              initialValues: state.editClient // pull initial values from client reducer
            }),
            { reducer } // bind client loading action creator
          )(ClientForm)
  
    export default ClientForm
  </code></pre>
  
  <p>Now I import my reducer using the following import:</p>
  
  <pre><code>     import reducer from '../edit/reducer'
  </code></pre>
  
  <p>No errors - it finds this.</p>
  
  <p>Here is the reducer:</p>
  
  <pre><code>  import { fetch, addTask } from 'domain-task'
    import { getJwt } from '../../../auth/jwt'
    import { handleErrors } from '../../../utils/http'
    import {
      REQUEST_CLIENT_TO_EDIT,
      RECEIVE_CLIENT_TO_EDIT,
      ERROR_CLIENT_EDIT,
    } from './actions'
  
    const initialState = {
      isLoading: false,
      isEditMode: null,
      error: null,
      id: null,
      clientNo: null,
      company: false,
      companyName: null,
      abn: null,
      isWarrantyCompany: false,
      requiresPartsPayment: false,
      companyEmail: null,
      clientFirstName: null,
      clientLastName: null,
      mobilePhone: null,
      phone: null,
      email: null,
      notes: null,
      bankName: null,
      bsb: null,
      account: null,
      activity: false,
      active: false,
      dateCreated: null,
      userName: null,
    }
  
    export default (state = initialState, action) =&gt; {
      switch (action.type) {
        case REQUEST_CLIENT_TO_EDIT:
          return {
            ...state,
            id: action.payload,
            isLoading: true,
            error: null,
          }
  
        case RECEIVE_CLIENT_TO_EDIT:
          return {
            ...state,
            ...action.payload,
            isLoading: false,
            error: null,
          }
  
        case ERROR_CLIENT_EDIT:
          return {
            ...state,
            isLoading: false,
            error: action.payload,
          }
  
        default:
          return state
      }
    }
  </code></pre>
  
  <p>This is called by the action and results in the state being updated.</p>
  
  <p>Here is a picture showing editClient in the redux tools in chrome...</p>
  
  <p><a href="https://i.stack.imgur.com/VEC6a.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VEC6a.png" alt="enter image description here"></a></p>
  
  <p>Why wont the page load "editClient"? What have I missed or misinterpreted.</p>
  
  <p>By the way, here is the full form for client (I figure its better to have the full context re the form):</p>
  
  <pre><code>      import React, { PropTypes } from 'react'
    import { Field, reduxForm, FormSection } from 'redux-form'
    import { connect } from 'react-redux'
    import { Col, Row } from 'react-bootstrap'
    import { Button, Glyphicon, Panel } from 'react-bootstrap'
    import Moment from 'moment'
    import Address from '../../address/addressContainer'
    import FormField from '../../formComponents/formField'
    import CheckboxField from '../../formComponents/checkboxField'
    import TextField from '../../formComponents/textField'
    import StaticText from '../../formComponents/staticText'
    import TextAreaField from '../../formComponents/textAreaField'
    import DateField from '../../formComponents/datefield'
  
    import reducer from '../edit/reducer'
  
    export const CLIENT_FORM_NAME = 'Client'
  
    const required = value =&gt; (value ? undefined : 'Required')
    const maxLength = max =&gt; value =&gt;
      value &amp;&amp; value.length &gt; max ? `Must be ${max} characters or less` : undefined
    const number = value =&gt;
      value &amp;&amp; isNaN(Number(value)) ? 'Must be a number' : undefined
    const minValue = min =&gt; value =&gt;
      value &amp;&amp; value &lt; min ? `Must be at least ${min}` : undefined
    const email = value =&gt;
      value &amp;&amp; !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(value)
        ? 'Invalid email address'
        : undefined
    const tooOld = value =&gt;
      value &amp;&amp; value &gt; 65 ? 'You might be too old for this' : undefined
    const aol = value =&gt;
      value &amp;&amp; /.+@aol\.com/.test(value)
        ? 'Really? You still use AOL for your email?'
        : undefined
  
    const normalizeMobilePhone = value =&gt; {
      if (!value) {
        return value
      }
  
      const onlyNums = value.replace(/[^\d]/g, '')
      if (onlyNums.length &lt;= 4) {
        return onlyNums
      }
      if (onlyNums.length &lt;= 8) {
        return `${onlyNums.slice(0, 4)} ${onlyNums.slice(4)}`
      }
      return `${onlyNums.slice(0, 4)} ${onlyNums.slice(4, 7)} ${onlyNums.slice(7, 10)}`
    }
  
    export const Client = (props) =&gt; {
      const { 
        handleSubmit,
        companyValue,
        isWarrantyCompanyValue,
        isEditMode } = props
  
      const { reset } = props
  
      return (
        &lt;Row&gt;
          &lt;Col md={12}&gt;
            &lt;h2&gt;&lt;Glyphicon glyph="edit" /&gt; {isEditMode ? 'Edit' : 'New'} Client&lt;/h2&gt;
            &lt;hr /&gt;
            &lt;form onSubmit={handleSubmit} className="form-horizontal"&gt;
              {isEditMode &amp;&amp; (
                &lt;Panel header={&lt;h3&gt;Client - Basic Details&lt;/h3&gt;}&gt;
                  &lt;Row&gt;
                    &lt;Field component={StaticText}
                      name="clientNo"
                      id="clientNo"
                      label="Client No."
                      fieldCols={4}
                      labelCols={4}
                      controlCols={8}
                    /&gt;
  
                    &lt;Field component={StaticText}
                      name="dateCreated"
                      id="dateCreated"
                      label="Date Created."
                      fieldCols={4}
                      labelCols={4}
                      controlCols={8}
                    /&gt;
  
                    &lt;Field component={StaticText}
                      name="userName"
                      id="userName"
                      label="Created By."
                      fieldCols={4}
                      labelCols={4}
                      controlCols={8}
                    /&gt;
                  &lt;/Row&gt;
  
                  &lt;Row&gt;
                    &lt;Field
                      component={props =&gt; {
                        return (
                          &lt;StaticText {...props}&gt;
                            &lt;p
                              className="form-control-static"
                            &gt;
                              &lt;Glyphicon glyph={props.input.value ? 'ok' : 'remove'} /&gt;
                              {' '}{props.input.value ? 'Has jobs attached' : 'No jobs attached'}
                            &lt;/p&gt;
                          &lt;/StaticText&gt;
                        )
                      }}
                      name="activity"
                      id="activity"
                      label="Activity"
                      fieldCols={4}
                      labelCols={4}
                      controlCols={8}
                    /&gt;
  
                    &lt;Field component={CheckboxField}
                      name="active"
                      id="active"
                      label="De-Activate"
                      checkboxLabel="De activate this client"
                      fieldCols={4}
                      labelCols={4}
                      controlCols={8}
                    /&gt;
                  &lt;/Row&gt;
                &lt;/Panel&gt;
              )}
  
              &lt;Panel header={&lt;h3&gt;Client - CompanyDetails&lt;/h3&gt;}&gt;
  
                &lt;Row&gt;
                  &lt;Field component={CheckboxField}
                    id="company"
                    name="company"
                    label="Company?"
                    checkboxLabel="Client represents a company"
                    fieldCols={6}
                    labelCols={3}
                    controlCols={9}
                  /&gt;
                &lt;/Row&gt;
                {companyValue &amp;&amp; (
                  &lt;div&gt;
                    &lt;Row&gt;
                      &lt;Field component={TextField}
                        name="companyName"
                        id="companyName"
                        type="text"
                        label="Company Name"
                        placeholder="Enter company name..."
                        fieldCols={6}
                        labelCols={3}
                        controlCols={9}
                      /&gt;
  
                      &lt;Field component={TextField}
                        name="abn"
                        id="abn"
                        type="text"
                        label="ABN."
                        fieldCols={6}
                        labelCols={3}
                        controlCols={5}
                      /&gt;
                    &lt;/Row&gt;
                    &lt;Row&gt;
                      &lt;Field component={CheckboxField}
                        id="isWarrantyCompany"
                        name="isWarrantyCompany"
                        label="Warranty Company?"
                        checkboxLabel="Client represents a warranty company"
                        fieldCols={6}
                        labelCols={3}
                        controlCols={9}
                      /&gt;
                      {isWarrantyCompanyValue &amp;&amp; (
                        &lt;Field component={CheckboxField}
                          id="requiresPartsPayment"
                          name="requiresPartsPayment"
                          label="Requires Parts Payment?"
                          checkboxLabel="We pay for parts"
                          fieldCols={6}
                          labelCols={3}
                          controlCols={9}
                        /&gt;
                      )}
                    &lt;/Row&gt;
                    &lt;Row&gt;
                      &lt;Field component={TextField}
                        name="companyEmail"
                        id="companyEmail"
                        type="email"
                        label="Spare Parts Email."
                        placeholder="Enter spare parts email..."
                        fieldCols={6}
                        labelCols={3}
                        controlCols={9}
                      /&gt;
                    &lt;/Row&gt;
                  &lt;/div&gt;
                )}
              &lt;/Panel&gt;
  
              &lt;Panel header={&lt;h3&gt;Client - {companyValue ? 'Company Contact' : 'Personal'} Details&lt;/h3&gt;}&gt;
  
                &lt;Row&gt;
                  &lt;Field component={TextField}
                    name="clientFirstName"
                    id="clientFirstName"
                    type="text"
                    label="First Name."
                    placeholder="Enter first name..."
                    fieldCols={6}
                    labelCols={3}
                    controlCols={9}
                    validate={[required]}
                  /&gt;
  
                  &lt;Field component={TextField}
                    name="clientLastName"
                    id="clientLastName"
                    type="text"
                    label="Last Name."
                    placeholder="Enter last name..."
                    fieldCols={6}
                    labelCols={3}
                    controlCols={9}
                  /&gt;
                &lt;/Row&gt;
  
                &lt;Row&gt;
                  &lt;Field component={TextField}
                    name="mobilePhone"
                    id="mobilePhone"
                    type="text"
                    label="Mobile No."
                    placeholder="Enter mobile No..."
                    fieldCols={6}
                    labelCols={3}
                    controlCols={5}
                    normalize={normalizeMobilePhone}
                  /&gt;
  
                  &lt;Field component={TextField}
                    name="phone"
                    id="phone"
                    type="text"
                    label="Phone No."
                    placeholder="Enter phone No..."
                    fieldCols={6}
                    labelCols={3}
                    controlCols={5}
                  /&gt;
                &lt;/Row&gt;
  
                &lt;Row&gt;
                  &lt;Field component={TextField}
                    name="email"
                    id="email"
                    type="email"
                    label="Email."
                    placeholder="Enter email address..."
                    fieldCols={6}
                    labelCols={3}
                    controlCols={9}
                  /&gt;
                &lt;/Row&gt;
              &lt;/Panel&gt;
  
              &lt;FormSection name="Address"&gt;
                &lt;Address /&gt;
              &lt;/FormSection&gt;
  
              &lt;Panel header={&lt;h3&gt;Notes&lt;/h3&gt;}&gt;
                &lt;Row&gt;
                  &lt;Field component={TextAreaField}
                    id="notes"
                    name="notes"
                    label="Notes."
                    placeholder="Enter notes here..."
                    fieldCols={12}
                    labelCols={1}
                    controlCols={11}
                  /&gt;
                &lt;/Row&gt;
              &lt;/Panel&gt;
  
              &lt;Panel header={&lt;h3&gt;Client - Bank Details&lt;/h3&gt;}&gt;
                &lt;Row&gt;
                  &lt;Field component={TextField}
                    name="bankName"
                    id="bankName"
                    type="text"
                    label="Bank Name."
                    placeholder="Enter bank name..."
                    fieldCols={4}
                    labelCols={4}
                    controlCols={8}
                  /&gt;
  
                  &lt;Field component={TextField}
                    name="bsb"
                    id="bsb"
                    type="text"
                    label="BSB No."
                    placeholder="Enter BSB No..."
                    fieldCols={4}
                    labelCols={4}
                    controlCols={8}
                  /&gt;
  
  
                  &lt;Field component={TextField}
                    name="account"
                    id="account"
                    type="text"
                    label="Account No."
                    placeholder="Enter Account No..."
                    fieldCols={4}
                    labelCols={4}
                    controlCols={8}
                  /&gt;
                &lt;/Row&gt;
              &lt;/Panel&gt;
  
              &lt;div className="panel-body"&gt;
                &lt;Row&gt;
                  &lt;Col xs={4}&gt;
                    &lt;Row&gt;
                      &lt;Col xs={8} xsOffset={4}&gt;
                        &lt;Button bsStyle="primary" type="submit" bsSize="small"&gt;
                          &lt;Glyphicon glyph="ok" /&gt; Submit
                        &lt;/Button&gt;
                        {' '}
                        &lt;Button type="reset" bsSize="small" onClick={reset}&gt;
                          &lt;Glyphicon glyph="ban-circle" /&gt; Clear
                        &lt;/Button&gt;
                      &lt;/Col&gt;
                    &lt;/Row&gt;
                  &lt;/Col&gt;
                &lt;/Row&gt;
              &lt;/div&gt;
            &lt;/form&gt;
          &lt;/Col&gt;
        &lt;/Row &gt;
      )
    }
  
    let ClientForm = reduxForm({
      form: CLIENT_FORM_NAME,
  
    })(Client)
  
          ClientForm = connect(
            state =&gt; ({
              initialValues: state.editClient // pull initial values from client reducer
            }),
            { reducer } // bind client loading action creator
          )(ClientForm)
  
    export default ClientForm
  </code></pre>