Redux form does not read SelectField value

Question

I have a very simple form with reaction and reduction. I want to get all the values ​​of the fields of my form and send them with jQuery ajax to my RESTful api.

Now my only problem is that obviously redux-form does not read the value of SelectField. For example, when I look at redux-devTools other than SelectFields, every other input is there. I searched and read whole documents a lot, and I realized that SelectField is a bit more complicated in redux form, but I can't get it to work. How to get SelectFields values ​​with reducex-form v5.3.1?

I use:

• Material-ui v0.15.4

• Redux-form v5.3.1

• React v15.3.0

Change 1:

I tried different approaches:

First : using onChangeonSelectField

                        <SelectField
                            ref="customerGroup"
                            {...customerGroup}
                            fullWidth
                            floatingLabelText="customer group"
                            value={this.state.selectedCustomerGroup}
                            maxHeight={200}
                            onChange={(e,s,value)=>setState({selectedCustomerGroup: value}}
                        >
                            {groups}
                        </SelectField>

: setState SelectField

                        for(let group of groupsArray){
        groups.push(<MenuItem className={style.menuItem} value={group.id} key={group.id} primaryText={group.name} onTouchTap={()=>this.setState({selectedCustomerGroup: group.id})}/>);
    }
                        <SelectField
                            ref="customerGroup"
                            {...customerGroup}
                            fullWidth
                            floatingLabelText="customer group"
                            value={this.state.selectedCustomerGroup}
                            maxHeight={200}
                            {groups}
                        </SelectField>

:

constructor(props){
    super(props);
    this.state = {
        selectedCustomerGroup: 1
    };
}

, , customerGroup SelectField

16/27/8:

- .

Answer 1

, . .

-, Redux-Form. github .. , , , html.

-, fetch api jquery xhr ..

setState refs!

( )

<SelectField
                        ref="customerGroup"
                        {...customerGroup}
                        fullWidth
                        floatingLabelText="customer group"
                        value={this.state.selectedCustomerGroup}
                        maxHeight={200}
                        onChange={(e,s,value)=>{customerGroup.onChange(e);setState({selectedCustomerGroup: value})}}
                    >
                        {groups}
                    </SelectField>

Answer 2

?

const renderSelectField = props => (
  <SelectField
    floatingLabelText={props.label}
    errorText={props.touched && props.error}
    {...props}
    onChange={(event, index, value) => props.onChange(value)}>
  </SelectField>
)


<Field name="favoriteColor" component={renderSelectField} label="Favorite Color">
  <MenuItem value={'ff0000'} primaryText="Red"/>
  <MenuItem value={'00ff00'} primaryText="Green"/>
  <MenuItem value={'0000ff'} primaryText="Blue"/>
</Field>

: