how to select all checkbox?

[_andrea.l]

I have n checkboxes and 1 checkbox 'SELECT ALL'.
for example:
<form action="" method="get">
<input name="sa" type="checkbox" value="v"> select all
<input name="c1" type="checkbox" value="v"> option 1
<input name="c2" type="checkbox" value="v"> option 2
<input name="c3" type="checkbox" value="v"> option 3
....
<input name="cn" type="checkbox" value="v"> option n
</form>


I'd like check all checkboxes when I select 'sa' (select all) and deselect
all boxes when I select one checkbox (less the checkbox I had selected)
How can I do that?
Thank you in advance,
Andrea.

 

[Matt Kruse]

I'd like check all checkboxes when I select 'sa' (select all) and
deselect all boxes when I select one checkbox (less the checkbox I
had selected) How can I do that?

I have a lib for this purpose, if that would help. See code and examples at:
http://www.javascripttoolbox.com/checkboxgroup/

 

[RobG]

I have n checkboxes and 1 checkbox 'SELECT ALL'.
for example:
<form action="" method="get">
<input name="sa" type="checkbox" value="v"> select all
<input name="c1" type="checkbox" value="v"> option 1
<input name="c2" type="checkbox" value="v"> option 2
<input name="c3" type="checkbox" value="v"> option 3
...
<input name="cn" type="checkbox" value="v"> option n
</form>


I'd like check all checkboxes when I select 'sa' (select all) and deselect
all boxes when I select one checkbox (less the checkbox I had selected)
How can I do that?

<script type="text/javascript">
function checkAll( el, tick ) {
var els = el.form.elements;
var x, i = els.length;
while ( i-- ) {
x = els;
if ( 'input' == x.nodeName.toLowerCase() &&
'checkbox' == x.type ) {
x.checked = tick;
}
}
}

function checkThis( el ) {
checkAll( el, false );
el.checked = true;
}

</script>

<form action="">
<input name="sa" type="checkbox" value="v" onclick="
checkAll(this, true);
"> select all<br>
<input name="c1" type="checkbox" value="v" onclick="
checkThis(this);
"> option 1<br>
<input name="c2" type="checkbox" value="v" onclick="
checkThis(this);
"> option 2<br>
<input name="c3" type="checkbox" value="v" onclick="
checkThis(this);
"> option 3<br>
<input name="cn" type="checkbox" value="v" onclick="
checkThis(this);
"> option n<br>
<input type="reset">
</form>

 

[_andrea.l]

I get the opportunity to thank you and all the people how had answer or just
read all my questions (this and all in the past).

I have a question:
I don't understand well this line:

if ( 'input' == x.nodeName.toLowerCase() &&

what is userfull for?

Thank you in advance,
Andrea.

 

[RobG]

I get the opportunity to thank you and all the people how had answer or just
read all my questions (this and all in the past).

I have a question:
I don't understand well this line:


what is userfull for?

That test is within a while loop, it looks to see if the current node is
an input element and if it is, it then checks to see if it's a checkbox.

If either of the above are not true, the loop goes to the next element.

If both the above tests are true, the checkbox is set to checked or not
depending on whether the 'tick' parameter is true or false respectively.

It is important to do a sequence of tests as simply assuming that the
node is a checkbox and attempting set its 'checked' property may cause
an error. By testing in sequence with an AND ( && ) test, the 'if'
statement should pass or fail gracefully for any element it may come across.

I should note that the above is a bit of 'belt and braces' approach.
You should be able to set a 'checked' attribute on any form element
(even those that have no 'checked' attribute defined in the HTML
specification) without generating an error, but I can't guarantee that
will occur in every case for all browsers.

 

[RobG]

RobG wrote:
[...]

I should note that the above is a bit of 'belt and braces' approach. You
should be able to set a 'checked' attribute on any form element (even

I'll correct that to ' any form control or HTML element '.

[...]