Just allow to select one radio button

Question

Im using bootstrap radio buttons, and I dont want that the user can select multiple radio buttons. But its not working, the user can select all the radio buttons.

Do you know why?

div class="form-row">
<div class="form-group col col-lg-6">
  <label for="rtypes" class="">Rtypes</label>

  <div class="form-check">
    <input class="form-check-input" type="radio" name="radiobutton1" id="" value="option1" checked>
    <label class="form-check-label" for="radiobutton1">
                                RadioButton1
                            </label>
  </div>

  <div class="form-check">
    <input class="form-check-input" type="radio" name="radiobutton2" id="radiobutton2" value="option2">
    <label class="form-check-label" for="exampleRadios2">
                                RadioButton2
                            </label>
  </div>

</div>
</div>

Possible duplicate of [how to set that only one radio button can be checked](https://stackoverflow.com/questions/5419459/how-to-set-that-only-one-radio-button-can-be-checked) — Obsidian Age, Feb 21 '18 at 19:56

score 14 · Accepted Answer · answered Feb 21 '18 at 19:55

Radio button attribute name have to be the same so the user can select only one with the same name. This way you can have multiple groups.

div class="form-row">
                <div class="form-group col col-lg-6">
                    <label for="rtypes" class="">Rtypes</label>

                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="radiobutton" id="" value="option1" checked>
                        <label class="form-check-label" for="radiobutton1">
                            RadioButton1
                        </label>
                    </div>

                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="radiobutton" id="radiobutton2"
                               value="option2">
                        <label class="form-check-label" for="exampleRadios2">
                            RadioButton2
                        </label>
                    </div>

                </div>
            </div>

Just allow to select one radio button

1 Answers1