SO: redux-form, submit

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.6.0/redux.min.js"></script>
<script src="https://npmcdn.com/[email protected]/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/[email protected]/dist/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-redux/4.4.4/react-redux.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux-form/7.0.0/redux-form.js"></script>
<div id="root">
</div>

CSS

.member {
  border: 1px black solid;
  padding: 6px;
  margin-top: 6px;
}

Babel + JSX

// BEGIN SETUP
const Component = React.Component
const {reduxForm, FormSection, FieldArray, Field, Fields, reducer: formReducer} = ReduxForm
const {createStore, combineReducers} = Redux
const {Provider} = ReactRedux
const reducers = {
  form: formReducer
}
const reducer = combineReducers(reducers)
const store = createStore(reducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
// END SETUP
// BEGIN EXAMPLE

const toUpperCase = (value) => {
	return value.toUpperCase();
};

const renderFields = (fields) => {
  const first = fields.first;
  const onChangeFirst = (event) => {
  	const newValue = event.target.value;
  	const normalizedValue = fields.normalize(newValue);
    first.input.onChange(normalizedValue);
  }
  
  const last = fields.last;
  // this could be done nicer, without duplication
  const onChangeLast = (event) => {
  	const newValue = event.target.value;
  	const normalizedValue = fields.normalize(newValue);
    last.input.onChange(normalizedValue);
  }
  return (
  	<div>
     First
     <input {...first.input } onChange={ onChangeFirst } /><br />
     Last
     <input {...last.input } onChange={ onChangeLast } /><br /><br />
    </div>
  )
}

const MyForm = ({handleSubmit}) => (
 <form onSubmit={ handleSubmit((formData) => alert(JSON.stringify(formData, null, 2))) } >
   <Fields 
      names={ ['first', 'last'] }
      normalize={ JSON.stringify }
      component={ renderFields }
   />
   <input type="submit" value="Submit form!" />
  </form>
)

const MyTestForm = reduxForm({
	form: 'myForm'
})(MyForm);

// END EXAMPLE
ReactDOM.render(
	<Provider store={store}>
    <MyTestForm />
  </Provider>,
  document.getElementById('root')
);