How to implement two submit button inside a single component
I have got a form . where i have to implement two submit button (add and submit) . Firstly, I submit the add button and I can get data. these data show in the UI , secondly I want to pass these data by using second submit button inside the database .
right now what I get from my from ? when I submit add button , I can show the data inside UI , but when I submit the same data inside database I get the new data from form . I want to submit existing data inside database .
how I can pass exisiting data inside database?
class StoreRequistion extends Component { constructor(props) { super(props); this.state = { section:'', lists:[] }; }
onSubmit = value => { value.preventDefault(); const existingdata = { section:this.state.section, lists:this.state.lists }; this.setState({ status:this.state.section, lists:this.state.lists.concat(existingdata) });
if(window.confirm("DO you ageree"))
{ this.props.storeAddRequistionActions(existingdata)
}
};
onChange = e => { this.setState({
[e.target.name]: e.target.value
});
}; render() { return ( <div className="animated fadeIn"> <div className="store_regiuistion"> <Card>
<CardBody>
<div className="meal-requision-form">
<form onSubmit={e => this.onSubmit(e)}>
<Col xs="6" sm="6" md="6" lg="6" xl="6">
<MDBInput
label="Section Name"
group
type="text"
name="section"
id="section"
validate
error="wrong"
success="right"
value={this.state.section}
onChange={this.onChange}
/>
</Col>
<Row className="float-right">
<button type="add" className="btn btn-primary foodBtn_Greeen" >
Add
<i class="fas fa-plus" />
</button>
<button type="submit" onClick={()=>(
this.props.storeSubmitRequistionActions(this.state.lists))}
class="btn btn-primary foodBtn" >
Submit
<i class="fas fa-check" />
</button>
</Row>
</form>
</div>
</CardBody>
</Card>
</div>
<StoreTable lists={this.state.lists} icon={this.state.icon} toggle={this.state.toggle} collapse={this.state.collapse}/>
</div>
);
} }
// export default Forms; const mapStateToProps = state => ({ storerequistion: state.storerequistion, });
export default connect( mapStateToProps, { storeAddRequistionActions,storeSubmitRequistionActions, loginUser } )(StoreRequistion);