title: How do I update an object in Reactjs
body: <p>I have a form in <code>reactjs</code>, that I am going to use to create user.  Here is the important part my code:</p>
  
  <pre><code>   var AddUser = React.createClass({
      mixins: [OverlayMixin],
      getInitialState: function() {
          this.state.user = {}
          return {
              isModalOpen: false
          };
      },
      addScout: function() {
         UserCreator.addUser({
           user: this.state.user
         })
      },
      ....
      updateUser: function(e) {
          this.state.user[e.currentTarget.id] = e.currentTarget.value;
      },
      ...
      render: function() {
          return ( &lt; button onClick = { this.toggleModal} type = "button" className = "btn btn-success" &gt;Add User &lt; /button&gt;
          );
      },
      renderOverlay: function() {
          if (!this.state.isModalOpen) {
              return &lt;span&gt;&lt;/span&gt;
          }
          return (
              &lt; Modal title = "Add a User" onRequestHide = { this.handleToggle} &gt;
                  &lt; div className = "modal-body" &gt;
                      &lt;form&gt;
                          &lt;div className="form-group"&gt;
                              &lt;label for="first_name"&gt;First Name&lt;/label&gt;
                              &lt;input id="first_name" className="form-control" onBlur={this.updateUser}&gt;&lt;/input&gt;
                          &lt;/div&gt;
                          &lt;div className="form-group"&gt;
                              &lt;label for="last_name"&gt;Last Name&lt;/label&gt;
                              &lt;input id="last_name" className="form-control" onBlur={this.updateUser}&gt;&lt;/input&gt;
                          &lt;/div&gt;
                      &lt;/form&gt;
                  &lt; /div&gt;
                  &lt;div className="modal-footer"&gt;
                      &lt;button onClick={this.addUser} className="btn btn-primary"&gt;Add&lt;/button &gt;
                      &lt;button onClick={this.toggleModal} className="btn btn-warning"&gt;Cancel&lt;/button &gt;
                  &lt; /div&gt;
              &lt;/Modal &gt;
          );
      }
  });
  </code></pre>
  
  <p>When the user opens the modal and inputs a first or last name, then the blur event triggers the <code>updateUser</code>.  When the <code>addUser</code> button is clicked then the <code>UserCreator.addUser</code> is called.</p>
  
  <p>The problem is that I am not setting the state with <code>setState</code>.  What is the <code>reactjs</code> way to handle these inputs.  How do I create an object to push the inputs into?  </p>