Question

I have a big form with several checkboxes, having names chkbx0..chkbxN for them (N is known by PHP code which generates the form). I want to create a link-like entity which will invert the checked status (so, what was checked becomes unchecked and vice versa) for all the checkboxes when it’s clicked. So basically I am interested in a javascript function which has a parameter (the “N”) and does the work, and I would call it something like this:

    <p>You can reverse checkboxes <a href="javascript:chkbxsnegate(<?php echo $n; ?>);">by clicking here</a>.</p>

The checkboxes are something like these:

    <input type="checkbox" name="chkbx0">
    <input type="checkbox" name="chkbx1">
    ...

I use the parameter “N”, because there can be more checkboxes, but I only need to invert checked status only till “N”.

Please suggest me a javascript code fragment to implement function “chkbxsnegate”. Thanks a lot in advance.

Answer 1

The following will work in most browsers, except IE7 and below (but it works in IE8 and 9)

function chkbxsnegate(n) {
    var qsa = document.querySelectorAll("input[type=checkbox][name=chkbx"+n+"]"),
        l = qsa.length, i;
    for( i=0; i<l; i++) qsa[i].checked = !qsa[i].checked;
}