javascript - React Material UI - Radio buttons in list are all selectable

Question

Hey I want to have a list of Radio Buttons for each item in my array. Currently my project is working fine, but not the radio buttons because all of them are selectable.

question from:https://stackoverflow.com/questions/65886801/react-material-ui-radio-buttons-in-list-are-all-selectable

Answer 1

You've got to set the name attribute in order to select only one

Here is the fiddle : https://codesandbox.io/s/mystifying-brown-m7f4k

              <label>
                {answer.text}
                {question.single ? (
                  <input
                    type="radio"
                    name={`radio_${question.id}`}
                    onChange={onChange(question.id, answer.id)}
                  />
                ) : (
                  <input
                    type="checkbox"
                    onChange={onClick(question.id, answer.id)}
                  />
                )}
              </label>