redux-form

form & initialValues properties not recognized with multiple forms in one component (redux-form v7.0.4)

由 纵然是瞬间 提交于 2019-12-07 02:21:58
问题 I'm creating multiple forms within a single component and to initialize them with the redux store I'm defining the form's name attribute in the <form> element, as opposed to within the reduxForm() helper, which was documented here... How to embed the same redux-form multiple times on a page? I'm creating the forms from the 'listing' object and passing it to my components with mapStateToProps() . I'm trying to set the initial values of the form with initialValues={} , but Redux Form is

className in <Field> in Redux Form

由 ≯℡__Kan透↙ 提交于 2019-12-06 17:07:30
问题 I've created a redux-form and i want to add className to each Field to customize them with css. The code for each field is: <Form onSubmit={handleSubmit(requestAccountsFilter)}> <FormGroup row> <Field id="symbol" name="symbol" type="text" component={inputField} placeholder="Enter Product Here" /> <Field id="side" name="side" component={inputField} type="select"> <option value={null}>Any</option> <option value="Buy">Buy</option> <option value="Sell">Sell</option> </Field> <Field id="status"

ReactJS - Redux Form - how to conditionally show/hide element based on radio Field element?

由 生来就可爱ヽ(ⅴ＜●) 提交于 2019-12-06 07:12:27
问题 I'm relatively new to Redux and I have a form that has some radio inputs "Yes" or "No". Basically, I want to conditionally show another element which contains another redux form field, based on that radio input selection. Is there a straight forward to do this? I'm trying to just check the formProps.site_visit value, but I get an error about it being undefined. For the record, I've greatly reduced the amount of code in this component for brevity sake. export class RequestForm extends React

TypeScript, redux-form and connect

由 点点圈 提交于 2019-12-06 04:03:12
问题 First of all, I'm very new to TS, React & Redux, so sorry if this is an obvious question. I'm trying to modify this example to get a form to load some information. It's using redux-form. I'm trying to figure out how to call connect and redux-form at the same time in the export of the component. Right now it's looking like this: class UserForm extends React.Component<IUserProps, void> { .. } export default ReduxForm.reduxForm({ form: 'user', fields: [ 'userName', 'password', 'firstName',

Does redux-form field value can hold object instead of just a string?

由 ▼魔方 西西 提交于 2019-12-06 01:24:56
问题 Does redux-form field value can hold object instead of just a string? Consider following example class SelectQuestions extends Component{ render(){ const {fields:{question1,question2},handleSubmit}=this.props; return <div> <form onSubmit={handleSumbit(this.handleFunction.bind(this))}> <SelectQuestion {...question1}/> <SelectQuestion {...question1}/> <button type="submit" className="btn btn-default">Submit</button> </form> </div> } } class SelectQuestion extends Component{ render (){ <select><

Redux Form, Radio Button Fields, how to support variable values?

由 我的梦境 提交于 2019-12-05 23:37:29
In my react redux form, I have the following: <fieldset className="form-group"> <legend>Radio buttons</legend> {this.props.job_titles.map(jobTitle => ( <div className="form-check" key={jobTitle.id}> <label className="form-check-label"> <Field name="job_title_id" component="input" type="radio" value={jobTitle.id} /> {' '} {jobTitle.title} </label> </div> ))} </fieldset> This renders the radio buttons correctly, but when you click to select a radio button, the radio button never sets as selected. You can't select an option - the form is broken. What's strange is if I update: value={jobTitle.id}

Handling submit in React/Redux form

由 六月ゝ 毕业季﹏ 提交于 2019-12-05 21:44:36
I want to capture the form values when a user submits a form. The React tutorial shows this: var CommentForm = React.createClass({ handleAuthorChange: function(e) { this.setState({author: e.target.value}); }, handleTextChange: function(e) { this.setState({text: e.target.value}); }, handleSubmit: function(e) { e.preventDefault(); var author = this.state.author.trim(); var text = this.state.text.trim(); if (!text || !author) { return; } render: function() { return ( <form className="commentForm" onSubmit={this.handleSubmit}> This style pushes all changes into state via a handling function per

Redirect after submit success redux-form

由 前提是你 提交于 2019-12-05 13:08:45
I would like to ask if this is the proper way to redirect to another page after redux-form submit success: const form = reduxForm({ form: 'HeroesCreateComponentForm', validate, onSubmitSuccess: () => { console.log('onSubmitSuccess called (yes, yes I do get called'); browserHistory.push('/') }, }); Did you try using next approach? react-router-redux import {push} from 'react-router-redux'; onSubmitSuccess has dispatch function as second parameter. See Redux form. onSubmitSuccess onSubmitSuccess : (result,dispatch) =>{ dispatch(push('/needed-route')) } 来源： https://stackoverflow.com/questions

redux-form is refreshing the page onSubmit

由 谁都会走 提交于 2019-12-05 12:25:46
I have a redux form that when submitted, is causing the entire browser page to refresh which is not desired... What am I doing wrong here to cause the page to refresh on submit? Rate.js import React from 'react'; import RateForm from '../../components/rate/RateForm'; class Rate extends React.Component { handleSubmit(data) { alert('x') console.log('handleSubmit'); console.log(data); } render() { const fields = [ { name: 'execution', type: 'select', options: [ { label: '5', value: '5' }, ], }, ] return ( <div> <RateForm fields={fields} handleSubmit={this.handleSubmit.bind(this)} /> </div> ) } }

How to run validation on a slice of a redux-form FieldArray state

由 醉酒当歌 提交于 2019-12-05 08:58:13
问题 I am running something very similar to the example here: http://redux-form.com/6.0.5/examples/fieldArrays/ Say I want to add a list of members and a list of hobbies under each member, like in the example above. What is different from the example above is, I want to also be able to validate each member, before I am able to add additional members or hobbies for that member. Similarly, I also want to be able to validate each hobby, before I can add another hobby. In other words, I want to be
订阅 redux-form