I'm building an application with dynamic forms (redux-form). I would like when user click on submit button to print values. Note that my submit button is placed in my application header (outside the form). To achieve this, I'm following this tutorial from Redux-form. When I press the "Save" button, I got this error in my console : (0 , _reduxForm.submit) is not a function(…).
My code :
Submit component
import React from 'react' import {connect} from 'react-redux' import {submit} from 'redux-form' const RemoteSubmitButton = ({dispatch}) => // How to get 'form' prop here ? <button type="submit" onClick={() => dispatch( submit() ) }>Save</button> export default connect()(RemoteSubmitButton) Main component
// Import librairies import Submit from 'submitBtn' export default class extends Component { ... render(){ return ( // html code <Submit form="newuser" /> // form prop gonna be dynamic ) } } submit.js
import {SubmissionError} from 'redux-form' const sleep = ms => new Promise(resolve => setTimeout(resolve, ms)) function submit(values) { return sleep(1000) // simulate server latency .then(() => { window.alert(`You submitted:\n\n${JSON.stringify(values, null, 2)}`) }) } export default submit new.js (New User)
//Import librairies import submit from 'submit' class UserForm extends Component { render() { const {error, resetForm, handleSubmit} = this.props return (<form onSubmit={ handleSubmit }> <!-- Generate dynamic fields --> </form>) } } let FormWrapper = reduxForm({form: 'newuser', onSubmit: submit})(UserForm) const selector = formValueSelector('newuser') // <-- same as form name FormWrapper = connect(state => state.form)(FormWrapper) Can you tell me what I'm doing wrong? or What can I do to make it work please ?