title: Changing the options in a Datalist with reactJS
body: <p>I'm trying to update the values in a Datalist when the user type in the input text field, I'm kind of newbie with ReactJS, I tried this code but it is not working:   </p>
  
  <pre><code>var MyList = React.createClass({
  getInitialState: function() {
      return {
          options: [&lt;option key={'taste'} value={'zeitwert'}&gt;{'Name'}&lt;/option&gt;]
      }
  },
  changeHandler: function(e) {
      console.log('In changeHandler');
      this.state.options.push(
        &lt;option key={'some_key2'} value={'some_value2'}&gt;{'Second Option'}&lt;/option&gt;,
        &lt;option key={'some_key3'} value={'some_value3'}&gt;{'Third Option'}&lt;/option&gt;
        );
  },
  render: function() {
      return (
        &lt;div&gt;
          &lt;input type="text" className="form-control" onChange={this.changeHandler} placeholder="Owner" list="slist" name="owner_id" /&gt;
          &lt;datalist id="slist"&gt;{this.state.options}&lt;/datalist&gt;
        &lt;/div&gt;
      )
  }
  </code></pre>
  
  <p>});</p>
  
  <p>I'm not getting any error message and the console.log line works fine, but the Second and Third options don't appear in the list.</p>
  
  <p>What I'm doing wrong? thx!</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>This code works:</p>
  
  <pre><code>  changeHandler: function(e) {
      console.log('In changeHandler');
      tmp = [];
      tmp.push(
        &lt;option key={'some_key2'} value={'some_value2'}&gt;{'Second Option'}&lt;/option&gt;,
        &lt;option key={'some_key3'} value={'some_value3'}&gt;{'Third Option'}&lt;/option&gt;
        );
      this.setState({options: tmp});
     },
  </code></pre>
  
  <p>Thanks Ilya! </p>