Redux-form submit buttom
grisena opened this issue · comments
import React, { Component } from 'react';
import { reduxForm } from 'redux-form';
import { createPost } from '../actions/index';
class PostsNew extends Component {
render() {
const { fields: {title, categories, content}, handleSubmit } = this.props;
return(
<Form onSubmit ={ handleSubmit(this.props.createPost) }>
<h3> Create A New Post </h3>
<div className ={ `form-group ${ title.touched && title.invalid ? 'has-danger' : '' }`>
<label> Title </label>
<input type ="text" className="form-control" {...title} />
<div className="text-help">
{title.touched ? title.error : ''}
</div>
</div>
<div className ={ `form-group ${ categories.touched && categories.invalid ? 'has-danger' : '' }`>
<label> Categories </label>
<input type ="text" className="form-control" {...categories} />
<div className="text-help">
{categories.touched ? categories.error : ''}
</div>
</div>
<div className ={ `form-group ${ content.touched && content.invalid ? 'has-danger' : '' }`>
<label> Content </label>
<textarea type ="text" className="form-control" {...content} />
<div className="text-help">
{content.touched ? content.error : ''}
</div>
</div>
<button type="submit" className="btn btn-primary"> Submit </button>
</Form>
);
}
}
function validate(values){
const errors ={};
if(!values.title) {
errors.title = 'Enter a username';
}
if(!values.categories) {
errors.categories = 'Enter categories';
}
if(!values.content) {
errors.content = 'Enter some content';
}
return errors;
}
export default reduxForm ({
form: 'PostsNewForm',
fields: ['title','categories','content'],
validate,
onSubmit: () => { }
},null,{createPost}) (PostsNew);
HELP PLEASE!!!
Submit button seems to not work and also the validation.
use version "redux-form": "^5.3.6", it will definately solve the problem
You have another error in
<div className ={ form-group ${ title.touched && title.invalid ? 'has-danger' : '' }
>
CHANGE TO
<div className ={ form-group ${ title.touched && title.invalid ? 'has-danger' : '' }
}>
You forget }
CODE: posts_new.js IN LINE{23, 33, 43}
https://github.com/justlearncode/react-redux-add-postsReduxSimpleStarter-issues-254/blob/master/posts_new.js