Unable to trigger a checkbox click immediately after changing disabled to false

[[email protected]…]

This bug occurs in Firefox but not Internet Explorer.

Code to reproduce:

<input id="chk" type="checkbox" disabled />
<label for="chk">Checkbox</label>

$('#chk').prop('disabled', false);
$('#chk').trigger('click');

(or see ​http://jsfiddle.net/kcLkZ/)

Expected results:

Checkbox is enabled and checked.

Actual results:

Checkbox is enabled but not checked.

[dmethvin]

This native seems to work consistently in that no browser alerts: ​http://jsfiddle.net/QF46h/

Do you want to just run the jQuery handlers? In that case use .triggerHandler(). If you actually want to have a click event fire on a disabled element that is in the control of the browser.

[anonymous]

@dmethvin,

I do not wish to have the click event fire for the disabled checkbox. I really do want to both enable the checkbox *and* check it. The user interface requires that.

At the moment, my workaround is to basically "hammer" the checkbox using setTimeout.

See my edits to ​http://jsfiddle.net/kcLkZ/

[anonymous]

Sorry, that should have been: jsfiddle.net/kcLkZ/1/

[anonymous]

One more time :)

​http://jsfiddle.net/kcLkZ/1/

[dmethvin]

I really do want to both enable the checkbox *and* check it.

So you don't want to click it, just check/disable it?

$("#chk").prop({disabled: false, checked: true});

If you need more help try the forum rather than the bug tracker.

[anonymous]

Replying to dmethvin:

So you don't want to click it, just check/disable it?

No, I really want to enable it, check it, and call the click event handler for it. Check this revised fiddle: ​http://jsfiddle.net/kcLkZ/3/.

$("#chk").prop({disabled: false, checked: true});

This does not simulate the user checking the checkbox, it just changes the state without calling the click handler.

If you need more help try the forum rather than the bug tracker.

Can you please explain why you think this isn't a bug? Isn't one of the goals of jQuery to smooth out the differences between browsers? I've reported a behavior that works differently between Explorer and Firefox. That enough should be a concern. But also, aren't DOM changes supposed to be synchronous? If triggering a click can't be performed immediately after enabling a checkbox, something is not quite completing by the time the next line of code is executed.

I appreciate you trying to help with my particular case, but my primary goal was to let you know about this bug, not receive tech support. If you think the bug is low priority and choose not to fix it, that's fine, but I don't understand writing it off as "notabug". It's a bug.

[dmethvin]

It doesn't make sense to disable a check box, then expect something to happen when you click it. jQuery's goal is not to create consistent behavior from a sequence of actions that don't make sense.

[dmethvin]

Oh, NOW I get it. un-disable and then click.

[devuxer]

Phew :)

[dougrchamberlain]

I'd be happy to look into this issue.

[dmethvin]

@dougrchamberlain Go for it, thanks!

[dougrchamberlain]

Okay, so I looked into this, and by using ​http://jsfiddle.net/kcLkZ/1/ in Firefox 32.0.3 it completely fails to mark the checkbox in versions < 1.11.0 It fails intermittently starting at version 1.10.1 and continues to fail intermittently through 1.x(edge) and it fails intermittently through all 2.x versions

Chaining the statements seems to reduce the number of failures, like in this jsfiddle ​http://jsfiddle.net/kcLkZ/8/ but it doesn't eliminate them

The chaining not being a valid workaround really surprised me since the object passed to .trigger() should have finished before returning the JQuery object. Since this is my first attempt at resolving an issue, I'm wondering where I should begin looking.

[dmethvin]

This seems like a Firefox bug, which happens even with no jQuery involved.

​http://jsfiddle.net/kcLkZ/10/

The problem goes away if the DOM .click() method is called asynchronously.

​http://jsfiddle.net/kcLkZ/11/

[dougrchamberlain]

disregard this comment

[m_gol]

Migrated to ​https://github.com/jquery/jquery/issues/1763