Toggle Button Validation

[mclamanna]

Is it possible to have validation on toggle buttons?

[mdo]

There's no validation styles for this currently, no. I'm not sure what we'd be able to do for that with CSS alone that'd be acceptable for all situations. I'm open to ideas!

One idea for me is, if those are truly radio powered buttons, you could theoretically use them to toggle form validation messages. I just don't know about how, if at all, to restyle the buttons.

[mclamanna]

We found a solution, basically taking this:
<input type="radio" name="suggestion" id="Validationoption1" required="">Suggestion
and making these small changes:
<input type="radio" name="radio" value="suggestion" id="Validationoption1" required="">Suggestion

Here is my pen showing a working example.

Thank you for making Bootstrap!

[ffoodd]

FWIW, using this solution I think we should be able to re-style buttons by placing hidden radio before button group and using something like [type="radio"]:invalid ~ .btn-group.

[mclamanna]

Forgot to add this:
<input type="radio" class="custom-control-input" id="customControlValidation3" name="radio" style="display:none;" required=""> <div class="invalid-feedback"> Please select your topic. </div>