title: Radio button onChange event not firing
body: <p>The radio buttons won't trigger the <code>onChange</code> event.
  However, the normal input box can trigger the <code>onChange</code> event.</p>
  
  <p>What's the problem?</p>
  
  <pre><code>handleFormChange(e) {
      debugger
      this.setState({[e.target.name]: e.target.value}, this.showState.bind(this, this.props));
  }
  
  
  &lt;div className="col-md-6 col-sm-6"&gt;
      &lt;div className="form-group"&gt;
          &lt;label&gt;Name&lt;/label&gt;
          &lt;input type="text" className="form-control"
                 name="name" value={this.state.name} onChange={this.handleFormChange.bind(this)} /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  
  &lt;div className="form-group"&gt;
      &lt;label&gt;Seat type : &lt;/label&gt;
      &lt;div className="btn-group" data-toggle="buttons"&gt;
          &lt;label className="btn active"&gt;
              &lt;input type="radio"
                     name="seat_type"
                     checked={this.state.seat_type==='indoor'}
                     onChange={ e =&gt; this.handleFormChange.bind(this)}
                     value={this.state.seat_type}
  
                     /&gt;&lt;i
              className="fa fa-circle-o fa-2x"/&gt;&lt;i
              className="fa fa-check-circle-o fa-2x"/&gt;&lt;span&gt; Indoor&lt;/span&gt;
          &lt;/label&gt;
          &lt;label className="btn"&gt;
              &lt;input type="radio"
                     name="seat_type"
                     checked={this.state.seat_type==='outdoor'}
                     onChange={ e =&gt; this.handleFormChange.bind(this)}
                     value={this.state.seat_type}
  
              /&gt;&lt;i
              className="fa fa-circle-o fa-2x"/&gt;&lt;i
              className="fa fa-check-circle-o fa-2x"/&gt;&lt;span&gt; Outdoor&lt;/span&gt;
          &lt;/label&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <h1>Updated to the following JSX but still not working.</h1>
  
  <p>I can switch the radio option. But not able to trigger handleFormChange callback.</p>
  
  <pre><code>      &lt;div className="btn-group" data-toggle="buttons"&gt;
        &lt;label className="btn active"&gt;
            &lt;input type="radio"
                   name="seat_type"
                   defaultChecked={this.state.seat_type==='indoor'}
                   onChange={ e =&gt; this.handleFormChange.bind(this)}
                   value='indoor'
  
                   /&gt;&lt;i
            className="fa fa-circle-o fa-2x"/&gt;&lt;i
            className="fa fa-check-circle-o fa-2x"/&gt;&lt;span&gt;321 Indoor&lt;/span&gt;
        &lt;/label&gt;
        &lt;label className="btn"&gt;
            &lt;input type="radio"
                   name="seat_type"
                   defaultChecked={this.state.seat_type==='outdoor'}
                   onChange={ e =&gt; { this.handleFormChange.bind(this) } }
                   value='outdoor'
            /&gt;&lt;i
            className="fa fa-circle-o fa-2x"/&gt;&lt;i
            className="fa fa-check-circle-o fa-2x"/&gt;&lt;span&gt; 123Outdoor&lt;/span&gt;
        &lt;/label&gt;
        &lt;/div&gt;
  </code></pre>
  
  <p>It seems this <code>&lt;div className="btn-group" data-toggle="buttons"&gt;</code> will affect the onClick event. Maybe some scripts are listening to this div. 
  Thanks guys</p>