Programatically checking input via jQuery not calling form's .change() event?

Question

So I'm using jQuery to skin some form checkboxes, and am doing something like the following:

$('.sexyCheckBox').on("click", function(e) {
    var clickedInput = $(this).parent().find("input");
    clickedInput.prop("checked", !clickedInput.prop("checked"));
}

However, it seems that, even though the checkbox in form is indeed being toggled, the form's .change() event is not being called.

Is this a bug in jQuery or am I missing something?

Arun P Johny · Accepted Answer · 2014-02-10 02:40:07Z

3

Programatic changes to inputs value does not fire the change event, you need to trigger it manually. The change event will be triggered only if the user changes the value of an input element.

clickedInput.prop("checked", !clickedInput.prop("checked")).change();

another way to write this is

clickedInput.prop("checked", function (i, val) {
    return !val;
}).change();//or .trigger('change')

answered Feb 10, 2014 at 2:40

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Programatically checking input via jQuery not calling form's .change() event?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related