how to get selected value onChange of react redux-form drop down

Question

I am using react redux form Fields and I have drop down of classes. I am able to select any class from drop down. but the issue is that whenever I select any value (class) from drop down I want to trigger action onChange. When I trigger action with on change drop down values does not set and it does not show selected value. I am using following lines of code

<Field name="class._id" component="select" className="form-control" onChange={this.onChange.bind(this)} >
              <option value="">Select class...</option>
              {this.props.classes.map(Class =>
              <option value={Class._id} key={Class._id} >{Class.name}</option>)}
</Field>

here is onChange function

 onChange(){
     console.log(" Triggered")
  }

If I do not set onChange event my drop down works correctly and it shows selected value correctly with proper text. but I want to call function whenever use select any value

Answer 1

Can you give more context for this code, perhaps putting the whole component (and any modules or containers or whatever) in a JSBin or Fiddle? That will help SO posters better know how to help you. That said, it looks like your code is correct. You can get the value out of the select kind of like this:

onChange(event) {
  console.log(event.target.value);
}

Does that help?

Answer 2

May be you should better use fields prop of redux and standard html elements?

const {fields} = this.props
<select {...fields.class} onChange={this.handleChange}>
...

handleChange(event) {
    // do your stuff
    this.props.fields.class.onChange(event)
}