change event not working with BS4 radio button groups?

[tim-peterson]

Bootstrap v4 issue:

For the button group radios I can't get the input:radio change event to fire, so developers looking to do things like $('input').on('change', function ( //do something ) }); could get frustrated. This might not be BS4's fault per se, but just something that works in BS3 and may confuse people.

[cvrebert]

You're referring to http://v4-alpha.getbootstrap.com/components/buttons/#checkbox-and-radio-buttons , correct?
We're still in the process of overhauling that widget to just use CSS sibling selectors instead of JavaScript.

[tim-peterson]

@cvrebert Thanks, yes the BS v4 radio button groups. A CSS-only solution would be awesome, though I'd imagine many people would still want to use the jQuery change event, which is what seems to be busted.

Is it possible the BS v4 button JS widgets are blocking events (e.preventDefault?) such that change doesn't fire? Clicking the buttons does toggle the radio checked attributes so their essential function still works, but having the JS such that it doesn't prevent change events from firing seems valuable to preserve too.

[cvrebert]

Is it possible the BS v4 button JS widgets are blocking events (e.preventDefault?)

Quite probably.
A pure-CSS solution wouldn't suffer from that problem.

[tim-peterson]

Perfect, thanks again! I don't know the etiquette so feel free to close this issue if that's what you typically do.

[tomas-marik]

Hi there,

I've just got stucked on this issue too. Problem seems to be in code part where "change" event being triggered in Button class:

if (triggerChangeEvent) {
      input.checked = !$(this._element).hasClass(ClassName.ACTIVE);
      $(this._element).trigger('change');
}

this._element points to LABEL so change event is not triggered on INPUT but instead on a wrapping LABEL element.

[mdo]

I believe this is a dupe of #16673? Problem sounds super similar with how the events are being handled for the input and label combo. See #16673 (comment).

[alexventuraio]

Hey there!
Has the issue being fixed? Because I still having it on Bootstrap v4.1.1. This is my example for reference.
The radio inputs do not get the checked attribute when clicking on them.