title: React form onSubmit is not working and input not allow to use white spaces
body: <p>GitHub Issue: <a href="https://github.com/facebook/create-react-app/issues/4290#issuecomment-380521431" rel="nofollow noreferrer">https://github.com/facebook/create-react-app/issues/4290#issuecomment-380521431</a></p>
  
  <p>I found strength thing:</p>
  
  <pre><code>    import React, { Component } from "react";
      import FieldGroup from "./FieldGroup";
      import { connect } from "react-redux";
      import { Form, Button } from "react-bootstrap";
      class UserUpdateForm extends Component {
        constructor(props) {
          super(props);
          this.handleUserUpdate = this.handleUserUpdate.bind(this);
          this.handleChangeName = this.handleChangeName.bind(this);
          this.handleChangeNickname = this.handleChangeNickname.bind(this);
          this.state = {
            name: this.props.current_user.name,
            nickname: this.props.current_user.nickname
          };
        }
  
        handleChangeName(event) {
          this.setState({
            name: event.target.value
          });
        }
        handleChangeNickname(event) {
          this.setState({
            nickname: event.target.value
          });
        }
  
        handleUserUpdate(event) {
          event.preventDefault();
          const url = event.target.action;
          console.log(url);
          return false;
        }
        render() {
          return (
            &lt;Form
              onSubmit={this.handleUserUpdate}
              action={this.props.action}
              method="patch"
              id={this.props.id}
            &gt;
              &lt;FieldGroup
                role="form"
                id={`${this.props.id}Name`}
                type="text"
                label="User Name"
                placeholder="Enter User Name"
                onChange={this.handleChangeName}
                value={this.state.name}
              /&gt;
              &lt;FieldGroup
                role="form"
                id={`${this.props.id}Nickname`}
                type="text"
                label="User Nickname"
                placeholder="Enter User Nickname"
                onChange={this.handleChangeNickname}
                value={this.state.nickname}
              /&gt;
              &lt;Button className="btn btn-primary btn-large centerButton" type="submit"&gt;Send&lt;/Button&gt;
            &lt;/Form&gt;
          );
        }
      }
  
      export default connect(state =&gt; ({
        current_user: state.current_user
      }))(UserUpdateForm);
  </code></pre>
  
  <p>The Sign In/Sign Up form work, but UserUpdate not. Actually, <code>onSubmit</code> doesn't work. Also whitespaces skipped. I don't see <code>console.log(url)</code> or error.</p>
  
  <p>I think, problem is in the <code>&lt;Navbar&gt;</code> Component of <code>react-bootstrap</code>, because, when i wrote my own <code>&lt;Modal&gt;</code> and inserted it to this <code>&lt;Navbar&gt;</code>, the problem wasn't solved. If I move <code>&lt;form&gt;</code> from <code>&lt;Navbar&gt;</code> all work.</p>
  
  <p>App: <a href="https://on-money.herokuapp.com" rel="nofollow noreferrer">https://on-money.herokuapp.com</a></p>
  
  <p>Git: <a href="https://github.com/yashka713/on_money_front/blob/deploy/src/forms/UserUpdateForm.js" rel="nofollow noreferrer">https://github.com/yashka713/on_money_front/blob/deploy/src/forms/UserUpdateForm.js</a></p>
  
  <p>login: <code>onioni@example.com</code></p>
  
  <p>password: <code>password</code></p>
  
  <p>You should click on <code>User profile</code> and then click to <code>FontAwesome Icon</code>.
  Thx :)</p>