Radio Buttons.

I want to create a list of 3 items the user must then select one of the three items from the list by use of radio buttons.

My problem: I can't seem to insert radio buttons that does not allow you to select more than one at a time, the radio buttons I insert allows the user to select all of them at once.

I am using Bootstrap Studio 4.

The name field for each of that set of radio buttons all need to have the same value i.e. name="tigger"

<fieldset>
    <legend>Tigger is a:</legend>
    <div class="form-group">
        <div class="form-check">
            <input type="radio" name="tigger" value="tiger" class="form-check-input" id="formCheck-1" />
            <label for="formCheck-1" class="form-check-label">
                Tiger
            </label>
        </div>
    </div>
    <div class="form-group">
        <div class="form-check">
            <input type="radio" name="tigger" value="lion" class="form-check-input" id="formCheck-2" />
            <label for="formCheck-2" class="form-check-label">
                Lion
            </label>
        </div>
    </div>
    <div class="form-group">
        <div class="form-check">
            <input type="radio" name="tigger" value="cat" class="form-check-input" id="formCheck-3" />
            <label for="formCheck-3" class="form-check-label">
                Cat
            </label>
        </div>
    </div>
</fieldset>

You set those values for each input by first selecting the radio dot in the Live View pane then in the Options pane (top/right) select the Gear Icon and set the Name field to what you need it to be and then set the Value you field you are expecting to pass. Then do the same thing for the other radio dots accordingly. Each radio button should have the same Name field values in order to group them together.

Saj

1 Like