redux-form

I am trying to use React refs to focus a Redux-Form Field when it mounts. When I try this.refs.title.getRenderedComponent().focus() in componentDidMount , an error is thrown saying: edit_fund.js:77 Uncaught TypeError: Cannot read property 'getRenderedComponent' of undefined When I console.log this.refs, it is mostly an empty object and sometimes identifies 'title' as being a ref, but it is not dependable. Am I using refs incorrectly? My code is below for reference. componentDidMount = () => { this.refs.title .getRenderedComponent() .focus(); } ... <Field id="title" name="title" component=

i'd like to use DatePicker for selecting date using redux form. I create this: import React from 'react'; import DatePicker from 'react-datepicker'; import 'react-datepicker/dist/react-datepicker.css'; export default field => ( <div> <DatePicker onChange={field.value} selected={field.value} isClearable={true} > {field.children} </DatePicker> {field.meta.touched && field.meta.error && <span className="error">{field.meta.error}</span>} </div> ); <div className="form-group"> <div className="col-xs-12 col-sm-3 "> <div className="label" htmlFor="date-to">DATE TO</div>{' '} <Field id="date-to" name=

I am trying to add a second submit button to a redux-form . Both buttons should dispatch an action that saves the data but depending on the button pressed the user should be routed to different pages. So I defined a handler that I pass as onSubmit prop to the form. But as far as I can see only the form data is passed to this handler: The docs on handleSubmit note: A function meant to be passed to <form onSubmit={handleSubmit}> or to <button onClick={handleSubmit}> . It will run validation, both sync and async, and, if the form is valid, it will call this.props.onSubmit(data) with the contents

I'm trying to fill the profile form with data from API. Unfortunately redux-form doesn't want to cooperate with me in this case. For some reason fields stays empty whatever I do. Setting the fixed values instead of values passed from reducer work well for some reason. Maybe this is because I'm using redux-promise for API calls inside the action creators? How can I live with it and get rid of this. Here is my form component. import React, { Component } from 'react'; import { reduxForm, Field } from 'redux-form'; import { connect } from 'react-redux'; import { fetchRoleList, fetchUserData } from

In a redux-form handleSubmit function, which makes an Ajax call, some properties from the Redux state are needed in the Ajax (e.g. user ID). This would be easy enough if I wanted to define handleSubmit in the form's component: Just call mapStateToProps to pass in whatever I need, and read it from this.props in my handleSubmit . However, like a good React-Redux developer I write separate view components and containers , so my view components can be simple with little or no behavior. Therefore, I want to define handleSubmit in my container . Again, simple - redux-form is set up to do that.