В моем приложении у меня есть три указанных c пользователя: студенты, учителя и компании.
Когда администратор хочет создать пользователя, я хочу иметь список вкладок с радиовходом, который открывает вкладку с пользователь указывает c поля формы. Таким образом, я могу видеть, какой тип пользователя выбран, и у меня есть простой способ показать дополнительные поля.
На данный момент у меня есть это, и это работает, но действительно глючит. Он переключает вкладки в большинстве случаев, а активные классы портятся и иногда зависают.
<div class="btn-group btn-group-toggle w-100" id="nav-tab" role="tablist" data-toggle="buttons" >
<label class="btn btn-primary active">
<a class="position-relative stretched-link text-white" id="nav-student-tab" data-toggle="tab" href="#nav-student" role="tab" aria-controls="nav-student" aria-selected="true">
<input type="radio" name="userType" id="student" value="student" autocomplete="off" checked> Student
</a>
</label>
<label class="btn btn-primary">
<a class="position-relative stretched-link text-white" id="nav-teacher-tab" data-toggle="tab" href="#nav-teacher" role="tab" aria-controls="nav-teacher" aria-selected="false">
<input type="radio" name="userType" id="teacher" value="teacher" autocomplete="off"> Teacher
</a>
</label>
<label class="btn btn-primary">
<a class="position-relative stretched-link text-white" id="nav-company-tab" data-toggle="tab" href="#nav-company" role="tab" aria-controls="nav-company" aria-selected="false">
<input type="radio" name="userType" id="company" value="company" autocomplete="off"> Company
</a>
</label>
</div>
<!-- Here the standard tab content with user specific input fields -->
Очевидно, что работает с bootstrap 4, и я предпочитаю ванильное решение bootstrap
Эту кодовую ручку я использовал как справочную . Я хочу, чтобы эта интерактивная кнопка показывала соответствующую вкладку.
Есть идеи, как решить эту проблему?