By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,361 Members | 1,914 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,361 IT Pros & Developers. It's quick & easy.

how to select all checkbox?

P: n/a
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.
Jul 31 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
_andrea.l wrote:
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[i];
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>

--
Rob
Jul 31 '05 #2

P: n/a
_andrea.l wrote:
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/

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Jul 31 '05 #3

P: n/a
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.
Aug 1 '05 #4

P: n/a
_andrea.l wrote:
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?


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.

Thank you in advance,
Andrea.

--
Rob
Aug 1 '05 #5

P: n/a
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 '.

[...]

--
Rob
Aug 1 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.