score:0

You need to set the checked attribute on the <Radio> element as a response to some state/props, the following is a snippet from a Formik / react-bootstrap form:

  <Radio
    name="upload_radio"
    checked={status.upload_radio === 'textarea'}
    value="textarea"
    onChange={e => setStatus({ upload_radio: e.target.value })}
  >

score:1

The onChange event is being fired, but your handleChange function is not doing what you are expecting.

  handleChange(event){
    const formState = Object.assign({}, this.state.form)
    formState[event.target.name] = event.target.value
    this.setState({form: formState})
  }

If you take a look in a debugger, event.target does not have a name or value attribute for a check box. It simply has a checked attribute. You will have to find another way to get the information you are looking for out of the target.

score:1

To piggyback off the previous poster, in your Radio buttons you have value={this.state.form.adminRate} but adminRate is never defined in

this.state = {
 form: {
 teacherRate: '',
 overallRate: ''
}

So when you return formState[event.target.name] = event.target.value from your handleChange function its not inputting any value into the event.target.name. So you may just want to input 1, 2, and 3 as the value in the corresponding buttons.

Also even if it did input values, event.target.name in your Radio buttons are adminRate so you'd run into the this.state problem again, so you'd have to convert name={adminRate} to name={teacherRate} in the first FormGroup buttons so that the formState object in

handleChange(event){
const formState = Object.assign({}, this.state.form)
formState[event.target.name] = event.target.value
this.setState({form: formState})
} 

points to the teacherRate property inside the form object defined in this.state when you call this.setState({form: formState}) at the end of the function.

I don't know the relevance of using the 'Overall Rating' radio buttons so I can't assist with the second FormGroup but it would basically be the same logic as the first. You'd need Math logic to get the average number for the overall rating though.


Related Query

More Query from same tag