redux-form doesn't get submitted -
i have strange bug in app. want let user update name of group via redux form. exchanging old name input field works without problem, when click on submit, nothing happens. strange me, because using same form create group in first place , there works totally fine.
import react, { component } 'react'; import { connect} 'react-redux'; import { deleteaccessgroup, editaccessgroup } '../actions/useractions'; import { showmodal } '../actions/modalactions'; import * types '../actions/index'; import accessgroupcreation '../components/accessgroupcreation'; class accessgroupelement extends component { constructor(props) { super(props); this.state = { toggle: false } } handlesubmit = values => { this.props.editaccessgroup(values); console.log(this.state, "das sind die values: ", values); this.edit; console.log(this.state); } edit = () => this.setstate({toggle: !this.state.toggle}); delaccessgroup = () => this.props.deleteaccessgroup(this.props.accessgroup.id); showpicmodal = () => { let id = this.props.accessgroup.id; this.props.showmodal(types.modal_type_picupload, { title: 'please upload profile picture', onconfirm: (pic) => { console.log(this.props.accessgroup.id); console.log( pic) } }); } render() { const accessgroup=this.props.accessgroup; return( <div classname="row" id="hoverdiv"> <div classname="col-lg-1"></div> {this.state.toggle ? <div classname="col-lg-9"> <accessgroupcreation onsubmit={this.handlesubmit} /> </div> : <div classname="col-lg-9">{accessgroup.name}</div>} <div classname="col-lg-2"> <button type="button" onclick={this.delaccessgroup} classname="btn btn-default btn-sm pull-right"> <span classname="glyphicon glyphicon-trash"></span> </button> <button type="button" onclick={this.edit} classname="btn btn-default btn-sm pull-right"> <span classname="glyphicon glyphicon-pencil"></span> </button> </div> </div> ); } } export default connect(null, { deleteaccessgroup, editaccessgroup, showmodal })(accessgroupelement);
here form component:
import react 'react'; import { field, reduxform } 'redux-form'; const required = value => value ? undefined : 'required'; const lengthfunction = (min, max) => value => value && (value.length > max || value.length < min) ? `must between ${min} , ${max} characters` : undefined const length = lengthfunction(5, 20); const renderfield = ({ input, label, type, meta: { touched, error } }) => ( <div> <input {...input} placeholder={label} type={type} classname="form-control"/> {touched && (error && <span>{error}</span>)} </div> ); const accessgroupcreation = (props) => { const { handlesubmit, pristine, submitting } = props; return ( <form classname="form-inline" onsubmit={handlesubmit}> <div classname="input-group"> <field name="name" type="text" component={renderfield} label="add access group" validate={[ required, length]}/> <span classname="input-group-btn"> <button classname="btn btn-success" disabled={pristine || submitting} value="this.state.value" type="submit"> <span classname="glyphicon glyphicon-send"></span> submit </button> </span> </div> </form> ) } export default reduxform({ form: 'accessgroupcreationform' // unique identifier form })(accessgroupcreation)
help, always, appreciated.
issue in code:
handlesubmit = values => { this.props.editaccessgroup(values); console.log(this.state, "das sind die values: ", values); this.edit; // call function this.edit(); console.log(this.state); }
Comments
Post a Comment