Bootstrap switches do not work

Question

I use radio buttons in Bootstrap 4 as follows:

    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary active">
            <input type="radio" id="physical-option" onclick="alert('Physical!')" checked="checked" /> Physical
        </label>
        <label class="btn btn-primary">
            <input type="radio" id="scenery-option" onclick="alert('Scenery!')" /> Scenery
        </label>
    </div>

As you can see, I have onclicks. But when I click on them, nothing happens! Is this a bug in bootstrap?

Answer 1

Can you put onclick on a label instead of a radio? I think bootstrap makes a shortcut for the radio trigger instead of the actual switch.

Look at the landscape button:

https://jsfiddle.net/zf7p2Lbd/

    <label class="btn btn-primary" onclick="alert('Scenery!')">
        <input type="radio" id="scenery-option" /> Scenery
    </label>