title: Best way for a React and HTML Select-component to return String instead of Integer
body: <p>I have a React-class (JSX) that contains following (slightly simplified here) code:</p>
  
  <pre><code>var Select = React.createClass({
    onChange: function (ev) {
       console.log(ev.target.value);
    },
    render: function() {
       var optionsHtml = this.state.options.map(function (el) {
                      console.log(this.props.getValue(el);
                      return (
                          &lt;option key={this.props.getValue(el)}
                                  value={this.props.getValue(el)}&gt; { this.props.getLabel(el) } 
                          &lt;/option&gt;
                      )
                  });
      return &lt;select onChange={this.onChange}&gt;
       {optionsHtml}
      &lt;/html&gt;
  }
  </code></pre>
  
  <p>In the render-function, console.log returns Integers for values (i.e. 1, 2, 3) when initializing the Options-HTML and setting the values, however inside the onChange-method value is a String (i.e. "1", "2", "3") when the actual Select-box value is changed. </p>
  
  <p>One way to fix this would be to check and cast the value to Number before using it inside onChange, but is there any other way to do it?</p>
  
  <p>EDIT:</p>
  
  <p>Options-array could look something like this</p>
  
  <pre><code>var options = [
    { id: 1, name: "Test" },
    { id: 2, name: "Test2" },
    { id: 3, name: "Test3" }
  ]
  </code></pre>
  
  <p>Component then could be called with getValue and getLabel -functions like this:</p>
  
  <pre><code>&lt;Select options={options}, 
     getValue: function(v) {
        return v.id;
     },
     getLabel: function(v) {
        return v.name;
     }/&gt;
  </code></pre>
  
  <p>Different type is an issue once I generate a JSON that I'm sending to backend, and I need to the conversion at some point.</p>