title: Can't type in React input text field
body: <p>I'm trying my first bit of React.js and am stumped early on... I have the code below, which renders a search form into <code>&lt;div id="search"&gt;&lt;/div&gt;</code>. But typing in the search box does nothing.</p>
  
  <p>Presumably something is going missing passing the props and state up and down, and this seems like a common problem. But I'm stumped - I can't see what's missing.</p>
  
  <pre><code>var SearchFacet = React.createClass({
    handleChange: function() {
      this.props.onUserInput(
        this.refs.searchStringInput.value
      )
    },
    render: function() {
      return (
        &lt;div&gt;
          Search for:
          &lt;input
            type="text"
            value={this.props.searchString}
            ref="searchStringInput"
            onchange={this.handleChange} /&gt;
        &lt;/div&gt;
      );
    }
  });
  
  var SearchTool = React.createClass({
    render: function() {
      return (
        &lt;form&gt;
          &lt;SearchFacet 
            searchString={this.props.searchString}
            onUserInput={this.props.onUserInput}
           /&gt;
          &lt;button&gt;Search&lt;/button&gt;
        &lt;/form&gt;
      );
    }
  });
  
  var Searcher = React.createClass({
    getInitialState: function() {
      return {
        searchString: ''
      }
    },
  
    handleUserInput: function(searchString) {
      this.setState({
        searchString: searchString
      })
    },
  
    render: function() {
      return (
        &lt;div&gt;
          &lt;SearchTool 
            searchString={this.state.searchString}
            onUserInput={this.handleUserInput}
          /&gt;
        &lt;/div&gt;
      );
    }
  });
  
  ReactDOM.render(
    &lt;Searcher /&gt;,
    document.getElementById('searcher')
  );
  </code></pre>
  
  <p>(Eventually I will have other types of <code>SearchFacet*</code> but I'm just trying to get this one working.)</p>