title: React js and bootstrap modal from examples on github
body: <p>I'm trying to set up an app with react and everything is going well except for my modal. I've used this code from the following link, untouched and I get errors. <a href="https://github.com/facebook/react/blob/master/examples/jquery-bootstrap/js/app.js" rel="nofollow">https://github.com/facebook/react/blob/master/examples/jquery-bootstrap/js/app.js</a></p>
  
  <p>Try this fiddle <a href="http://jsbin.com/eGocaZa/1/edit?html,css,output" rel="nofollow">http://jsbin.com/eGocaZa/1/edit?html,css,output</a></p>
  
  <p>The callback functions don't seem to have access to "this". If you log "this" in the console, it logs the window object.</p>
  
  <pre><code>openModal: function() {
    this.refs.modal.open();
  },
  </code></pre>
  
  <p>I did pass in this and return a new function which seemed to work but that didn't seem right and not playing nice with jsfiddle. I got the modal firing locally but then I run into the same issue with the close function. Any help would be appreciated. Thanks!</p>
  
  <pre><code>var Example = React.createClass({
    handleCancel: function() {
      if (confirm('Are you sure you want to cancel?')) {
        this.refs.modal.close();
      }
    },
  
    render: function() {
      var modal = null;
      modal = (
        &lt;BootstrapModal
          ref="modal"
          confirm="OK"
          cancel="Cancel"
          onCancel={this.handleCancel}
          onConfirm={this.closeModal}
          title="Hello, Bootstrap!"&gt;
          This is a React component powered by jQuery and Bootstrap!
        &lt;/BootstrapModal&gt;
      );
      return (
        &lt;div className="example"&gt;
            {modal}
          &lt;BootstrapButton onClick={this.openModal(this)}&gt;Open modal&lt;/BootstrapButton&gt;
        &lt;/div&gt;
      );
    },
  
    openModal: function(obj) {
      return function(){obj.refs.modal.open();}
    },
  
    closeModal: function() {
      this.refs.modal.close();
    }
  });
  </code></pre>