Bootstrap Gender Radio Button Using - Code Example


Example 1: bootstrap radio button

<div class="form-check">   <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="option1" checked>   <label class="form-check-label" for="exampleRadios1">     Default radio   </label> </div> <div class="form-check">   <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value="option2">   <label class="form-check-label" for="exampleRadios2">     Second default radio   </label> </div> <div class="form-check disabled">   <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios3" value="option3" disabled>   <label class="form-check-label" for="exampleRadios3">     Disabled radio   </label> </div>

Example 2: bootstrap radio buttons

Bootstrap’s .button styles can be applied to other elements, such as <label>s, to provide checkbox or radio style button toggling. Add data-toggle="buttons" to a .btn-group  containing those modified buttons to enable their toggling behavior via  JavaScript and add .btn-group-toggle to style the <input>s within your buttons. Note that you can create single input-powered buttons or groups of them.  The checked state for these buttons is only updated via click event on the  button. If you use another method to update the input—e.g., with  <input type="reset"> or by manually applying the input’s checked  property—you’ll need to toggle .active on the <label> manually.  Note that pre-checked buttons require you to manually add the .active class to  the input’s <label>.  <div class="btn-group-toggle" data-toggle="buttons">   <label class="btn btn-secondary active">     <input type="checkbox" checked> Checked   </label> </div>

Comments

Popular posts from this blog

Are Regular VACUUM ANALYZE Still Recommended Under 9.1?

Can Feynman Diagrams Be Used To Represent Any Perturbation Theory?