Radio buttons need to click twice to reflect change
If you are like me and need to use event.preventDefault()
, for example to prevent the input from submitting. You can use event.stopPropagation()
instead.
see this issue comment explaining for more context
remove event.preventDefault();
from your handleOptionChange
method
For others running into this problem, make sure you are not using the same name
property for multiple groups of radio buttons.
This can happen when mapping through an array and rendering a set of radio buttons for each array item. Avoid this issue by adding the index of the current array item to the radio button name.
Note that in this case there should be no need for preventDefault
in the handleOptionChange
method.