が反応ブートストラップ

Question

フォームを送信することはできません、私は次のようreact-bootstrapコンポーネントがあります。

 <FormGroup onSubmit={this.gotEmail} role="form"> 
      <FormControl type="text" className="form-control"/> 
      <Button className="btn btn-primary btn-large centerButton" type="submit">Send</Button> 
     </FormGroup> 

は私が「送信」ボタンをクリックすると、フォームが送信されたいの。

ただし、ボタンをクリックすると、コントロールがthis.gotEmailメソッドに到達しません。

なぜそうですか？

Answer 1

FormGroupは、送信イベントを提供しません。あなたがform要素でそれをラップし、それにイベントハンドラをアタッチすることができます

<form onSubmit={this.gotEmail}> 
    <FormGroup role="form"> 
    <FormControl type="text" className="form-control"/> 
    <Button className="btn btn-primary btn-large centerButton" type="submit">Send</Button> 
    </FormGroup> 
</form> 

Answer 2

一つ欠けがありますが、私は思います。

gotEmail(event){ 
    event.preventDefault(); 
    // code you want to do 
} 

Answer 3

バージョン0.30.2のとおり、あなたは<Form>でそれをラップすることができます。ユーザーを押して「入力」は、ページがリロードされませんので、もし

はgotEmailでは、preventDefaultがあるはずですonSubmitプロパティをサポートしています：

<Form onSubmit={this.gotEmail}> 
    <FormGroup role="form"> 
    <FormControl type="text" className="form-control"/> 
    <Button className="btn btn-primary btn-large centerButton" 
    type="submit">Send</Button> 
    </FormGroup> 
</Form>