Repository navigation
Consider alternative method of styling toggle buttons (don't use data-toggle="buttons" for styling) #23728
Description
Activity
Yeah, this should be a class. I don't think anything else is done via
dataattributes?Yeah, this should be a class. I don't think anything else is done via data attributes?
Nope, I didn't bump into other cases where
data-*is needed for pure styling purposes. So apart from this particular case we should be all good!For the reference, the
data-toggle="buttons"selector is used today in JS plugin ().Lines 31 to 32 in 78f29d2
Using it in our JS is fine, but behavior should be detached from styles. That way you can drop our JS and use your own without styling issues.
Reacted by Pawel Kozlowski, Troy Morehouse, Tieson Trowbridge, Philip Giuliani and Tomáš Kout- added a commit that references this issue
on Dec 2, 2017 - added a commit that references this issue
on Dec 30, 2017
Ref: https://getbootstrap.com/docs/4.0/components/buttons/#checkbox-and-radio-buttons
As of today we need to add
data-toggle="buttons"to get proper styling on check / radio buttons done with inputs + labels. While I totally see how it works perfectly with provided jQuery plugins, it is not very intuitive for people not using jQuery but rather using a framework like Angular or React.Would you consider another method of styling toggle buttons, for example using a dedicated CSS class (eg.
.toggle-buttons)?I've opened similar issue in the past (#20359) but then closed it as a duplicate of #18874. #18874 in turn got closed as a duplicate of number of other issues without addressing the problem. Hence I'm opening a new issue to start with a "clean slate".