Question

So I have a gridview with a checkbox field. In jquery, I’d like to write a function that does something when an unchecked checkbox is checked.

function clickAllSize() {
    alert("helloy");
}

$(document).ready(function () {
    $("input :checkbox:not(checked)").change(clickAllSize());
});

The problem is that the function is running immediately on pageload, before any clicking. Subsequent checking/unchecking does not trigger the alert.

Answer 1

This should it:

$(document).ready(function () {
    $('input[type="checkbox"]:not(checked)').change(clickAllSize);
});

1. In the change callback you should give the function name, not calling it.
2. From the docs:

because :checkbox is a jQuery extension and not part of the CSS specification, queries using :checkbox cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use [type=”checkbox”] instead.

Jquery is designed to work with 0+ selected elements, so always when you debug JQuery code check what is the selector length:

var amount = $("input :checkbox:not(checked)").length;
alert(amount);  // -Probably 0...