Bootstrap data-toggle="buttons" свойство радио-галочки

Question

Я вижу, что событие изменения радиокнопок Bootstrap (созданное с помощью data-toggle="buttons") переключает активный класс между метками и не влияет на отмеченные свойства реальных радиокнопок. Это нормальное поведение или у меня ошибка?

Или, как я могу связать этот активный класс метки и проверенного свойства радио друг с другом в двух направлениях, чтобы они изменялись одновременно?

Пример кода:

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
    <input type="radio" name="options" id="option1" autocomplete="off" checked> Radio 1 (preselected)
  </label>
  <label class="btn btn-primary">
    <input type="radio" name="options" id="option2" autocomplete="off"> Radio 2
  </label>
  <label class="btn btn-primary">
    <input type="radio" name="options" id="option3" autocomplete="off"> Radio 3
  </label>
</div>

Answer 1

Проверьте этот код

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
    <input type="radio" name="options1" id="option1" autocomplete="off"> Radio 1 (preselected)
  </label>
  <label class="btn btn-primary">
    <input type="radio" name="options2" id="option2" autocomplete="off"> Radio 2
  </label>
  <label class="btn btn-primary">
    <input type="radio" name="options3" id="option3" autocomplete="off"> Radio 3
  </label>
</div>

С уважением

Answer 2

Если вы предварительно переключаете кнопку, вы должны вручную добавить .active класс и aria-pressed="true" к.

https://v4-alpha.getbootstrap.com/components/buttons/