Radio Button Selection in React

user_8305219 0
Viewed 53

I have successfully selected a radio button. My problem is I want to include the selection with the label also. The labels/words should be clickable also.

Here's my codesandbox CLICK HERE

 <RadioButton
    label="Food"
    name="radio"
    value="optionA"
    checked={select === "optionA"}
    handleChange={(event) => handleSelectChange(event)}
  />
  <RadioButton
    label="Water"
    name="radio"
    value="optionB"
    checked={select === "optionB"}
    handleChange={(event) => handleSelectChange(event)}
  />
react-hooks styled-components reactjs css
2 Answers

just include the radio button inside <label> tag

   <label>
   <RadioButton
        label="Food"
        name="radio"
        value="optionA"
        checked={select === "optionA"}
        handleChange={(event) => handleSelectChange(event)}
      />
   </label>
      <label>
      <RadioButton
        label="Water"
        name="radio"
        value="optionB"
        checked={select === "optionB"}
        handleChange={(event) => handleSelectChange(event)}
      />
      </label>

user_96906090
user_61083900
Related