0

One Fiddle is worth a thousand words. 

<div id="test-container" class="container-fluid">
    <input id="enableButtonCheck" type="checkbox" name="enableButton"/>Enable that button -->
    <i id="targetButton"class="disabled btn btn-sm btn-primary">Button</i>
</div>


 $('#test-container').on('click', '#targetButton', function(e) {
        alert('Hello, I\'m target button.');
    })
    $('#enableButtonCheck').on('click', function(e) {
        $('#targetButton').toggleClass('disabled', !$("#enableButtonCheck").is(":checked"));
    })

All works as intended in fiddle. This also used to work in my app before, but after last few commits it stopped. So I guess that it interacts with other parts of my project somehow. I have the same versions of Bootstrap and Jquery, and all other jquery/bootstrap functions work nice.

If I attach handler directly to button it works again.

$('#targetButton').on('click',function(e){
  alert('Hello, I\'m target button.');
})

Can somebody give me an idea which kind of interactions can prevent parent event handler from firing?

UPD. It appeared that I have this code which prevents handler from firing. Thanks for suggestions.

$('.disabled').on('click',function clickDisabled(event) {
    event.preventDefault();
    event.stopPropagation();
})

But I don't understand why, because...

UPD2: I found that I need to use delegated event handler instead of static to prevent events on .disabled class. For instance:

$('.disableds-static-parent').on('click', 'disabled', function clickDisabled(event) {
        event.preventDefault();
        event.stopPropagation();
})

from this answer.

Community
  • 1
  • 1
Vsevolod
  • 619
  • 1
  • 7
  • 14
  • 1
    you mean stoppropogation ?? – Mahi Dec 13 '16 at 11:13
  • 1
    Are you looking for [`event.stopImmediatePropagation()`](https://api.jquery.com/event.stopimmediatepropagation/)? – secelite Dec 13 '16 at 11:18
  • Something in my project prevent first type of event handler(on parent element) from firing it possibly affects handler in a way stopImmediatePropagation() would do. But I definitely don't have stopImmediatePropagation in my code(just checked). – Vsevolod Dec 13 '16 at 11:40
  • Well, it appears that I actually I have stopPropagation() for disabled class. – Vsevolod Dec 13 '16 at 11:45

0 Answers0