Need to make SelectField behaviour like html <select>

[albenik]

Classsic html behaviour

<select id="select_field" name="select_field">
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

When option selected, the displayed value in select field is equal to selected option text ('One' or 'Two'), but in JavaScript getDocumentById('select_field').value it equal to selected option value (1 or 2). Also the POST field value is a 1 or 2 not 'One' or 'Two'.
(https://jsfiddle.net/albenik/nrsdttds/5/)

This is expected behaviour for arbitrary Select.

But SelectField in controlled mode <SelectField value={this.state.somevalue} onChange={handler}/> require me to place option label (not option value) as select value of SelectField.
And then I need to get selected value somewhere in component i can not simple read it from state.
I have to store a complex object in state and write additional logic to handle it.

[albenik]

One more example
For example I have already loaded menuItems

redner() {
    return (
        <SelectField
            value={this.state.selected_value}
            itemLabel="name"
            menuItems={[
                {value: 1, name: 'One'},
                {value: 2, name: 'Two'}
            ]}
        />
    )
}

Then I recieved by ajax

{
    "select_field_value": 2
}

How can I set appropriate selection in SelectField?
Now as I understood I have to traverse menuItems to find the name of menu item with value = 2 and then setState with found item name.
Because if I simple call setState({selected_value: 2}) I will have wrong result.

[mlaursen]

This is the result of me being lazy and trying to reuse as much code as possible. It is really just a simple combination of the Menu and TextField components which is why the label is always the value. I will update this to how I usually make custom selects: a hidden input containing the value and a current label. This will allow the document.getElementById('something').value to work as well.

I also think that the component should do the heavy lifting to figure out which label to display based on the value given instead of having a developer figure it out each time they use the component.

[mlaursen]

This has been implemented in the v1.0.0 release. Going to close.