Как реализовать две кнопки отправки внутри одного компонента - PullRequest
Новая
       17

Как реализовать две кнопки отправки внутри одного компонента

0 голосов
/ 20 апреля 2019

У меня есть форма.где я должен реализовать две кнопки отправки (добавить и отправить).Во-первых, я отправляю кнопку добавления, и я могу получить данные.эти данные отображаются в пользовательском интерфейсе, во-вторых, я хочу передать эти данные с помощью второй кнопки отправки внутри базы данных.

прямо сейчас, что я получу от моего?Когда я отправляю кнопку добавления, я могу показать данные внутри пользовательского интерфейса, но когда я отправляю те же данные внутри базы данных, я получаю новые данные из формы.Я хочу представить существующие данные в базе данных.

как я могу передать существующие данные в базу данных? 

   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);
...