redux-form

I'm trying to create a redux form (using redux-form) that can dynamically create it's own inputs. I am having trouble figuring out how to make redux-form aware of the new fields that have been created. Is it possible to dynamically change the fields prop that redux-form passes in within the form component itself? Am I thinking about this wrong? Here is what I am working with. class AddCustomer extends Component { render() { class Form extends Component { constructor(props, context) { super(props, context) this.state = { inputsToAdd: [] }; } handleAddInput() { let inputsToAdd = this.state

I have a redux-form connected to my application state and everything seems to work great. I can fetch data and load it into my form, then submit data and get the metadata I want... However, I have a custom interaction (a color picker) that needs to change the value of a managed Field on the fly. Everything I try will change the screen, but not the redux form state i.e. when I submit the form I just get the original field data and not the new data shown in the form. The version below is passing the field props to the component and trying to use the ColorSelect component state as the field value

How to set defaultValue to input component? <Field name={`${prize}.rank`} defaultValue={index} component={Input} type='text'/> I tried like above but my fields are empty. I'm trying to create fieldArray (dynamic forms): {fields.map((prize, index) => <div key={index} className="fieldArray-container relative border-bottom" style={{paddingTop: 35}}> <small className="fieldArray-title marginBottom20">Prize {index + 1} <button type="button" title="Remove prize" className="btn btn-link absolute-link right" onClick={() => fields.remove(index)}>Delete</button> </small> <div className="row"> <div

Using the example of initializingFromState within Redux-Form, I am trying to set this up dynamically. This is to edit a particular book in a list of books, and is using a simple api set up in express.js. The full container is below. I somehow need to pass in initialValues , within the mapStateToProps function. In the example, it is done via a static object, but I can't work out how to use the information I have pulled in via fetchBook , and pass it to initialValues . Container: import React, { Component, PropTypes } from 'react'; import { reduxForm } from 'redux-form'; import { connect } from

I'm using redux-form and on blur validation. After I type the first character into an input element, it loses focus and I have to click in it again to continue typing. It only does this with the first character. Subsequent characters types remains focuses. Here's my basic sign in form example: import React, { Component } from 'react'; import { connect } from 'react-redux'; import { Field, reduxForm } from 'redux-form'; import * as actions from '../actions/authActions'; require('../../styles/signin.scss'); class SignIn extends Component { handleFormSubmit({ email, password }) { this.props

I have redux form having dropdown and text fields. On dropdown change i have to update the other fields. The other fields are using custom component example So the structure is like. 1. component having form 2. Field component. Now i googled and found few things to update the field but not able to do it. What i tried 1. Adding state in the field like below in value. Does not work. <Field name="accountno" value="this.state.accountno" component={InputText} placeholder="Number" /> Tried disptach but not able to use it. Getting error for no dispatch i prop type this.props.dispatch(change('form',

Im trying to use this code to pass a dynamic form name into reduxForm. Here is the code that I found: let FormAddress = compose(connect((state, props) => ({form: props.form})), reduxForm({destroyOnUnmount: false, asyncBlurFields: []}))(ValidationForm); From this article: https://github.com/erikras/redux-form/issues/603#issuecomment-254271319 But I'm not really sure whats going on. This is how I'm currently doing it: const formName = 'shippingAddress'; const form = reduxForm({ form: formName }); export default connect(mapStateToProps)(CityStateZip); But I would like to be able to pass it in

How to make server-side validation using redux-form and Fetch API? There are " Submit Validation " demo provided in the docs which says that recommended way to do server side validation is to return a promise from the onSubmit function. But where should I place that promise? As I understood onSubmit function should be my action. <form onSubmit={this.props.addWidget}>... Where this.props.addWidget is actually my action, provided below. import fetch from 'isomorphic-fetch'; ... function fetchAddWidget(widget, workspace) { return dispatch => { dispatch(requestAddWidget(widget, workspace)); return