Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Checkboxes tick all

Status
Not open for further replies.
peterb1985

peterb1985

MIS
Aug 18, 2003
111
GB
Is there a way to tick all checkboxes if the checkboxes all have the same name/id. For example I have a checkbox called tickAll and 10 other checkboxes containing values 10 to 100 all called subcheck.

Does anyone know of a function that will tick all of the subcheck checkboxes when the tickAll checkbox is ticked.
 
Sort by date Sort by votes
If tickAll is clicked and resulted in being checked, subcheck will all be checked; if it clicked and resulted in being unchecked, subcheck will all be unchecked.
[tt]
<input type="checkbox" name="tickAll" id="tickAll" onclick="handler(this)">

function handler(obj) {
var cchkbox=document.getElementById("subcheck");
for (var i=0; i<cchkbox.length;i++) {
cchkbox.checked=obj.checked;
}
}
[/tt]
You might not want both ways to happen. If not, then modify it and use an if statement only obj.checked conditional to wrap around the for-loop.
 
Upvote 0 Downvote
peterb,

it is not recommended that you create multiple elements with the same id. in fact, it is not supported - elements must have unique ids.



*cLFlaVA
----------------------------
[tt]( <P> <B>)[sup]13[/sup] * (<P> <.</B>)[/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote
Hi tsuji

I can't get your script to work, code below:

<html>

<head>
<title></title>
<script language="javascript">
function handler(obj) {
var cchkbox=document.getElementById("subcheck");
for (var i=0; i<cchkbox.length;i++) {
cchkbox.checked=obj.checked;
}
}
</script>
</head>

<body>

<form name="test" action="" method="post">
<input type="checkbox" name="tickAll" id="tickAll" onclick="handler(this)"><br />
<input type="checkbox" name="subcheck" id="subcheck" value="Y"><br />
<input type="checkbox" name="subcheck" id="subcheck" value="Y"><br />
</form>

</body>

</html>
 
Upvote 0 Downvote
Sorry. Indeed! use names.
[tt]
<script language="javascript">
function handler(obj) {
var cchkbox=document.getElement[red]sByName[/red]("subcheck");
for (var i=0; i<cchkbox.length;i++) {
cchkbox.checked=obj.checked;
}
}
</script>
[/tt]
 
Upvote 0 Downvote
i love how people only hear what they want to hear.

use the checkbox names, rather than using the same ID, [red]which is invalid[/red].

something like this:

Code: 
var f = document.forms['test'];
var e = f.elements;

function doThing(n, b) {
    for ( var i = 0; i < e.length; i++ ) {
        if (e[i].type == 'checkbox' && e[i].name == n)
            e[i].checked = b;
    }
}

and call it like this:

Code: 
<form name="test" action="" method="post">
<input type="checkbox" name="tickAll" id="tickAll" onclick="doThing('subcheck', this.checked)"><br />
<input type="checkbox" name="subcheck" id="subcheck1" value="Y"><br />
<input type="checkbox" name="subcheck" id="subcheck2" value="Y"><br />
</form>



*cLFlaVA
----------------------------
[tt]( <P> <B>)[sup]13[/sup] * (<P> <.</B>)[/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Upvote 0 Downvote
So your saying I should give them all the same id Cory?


;)

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

markronz
  • Locked
  • Question
Javascript to edit all script tags 1
Replies
2
Views
130
feherke
feherke
CrxC01
  • Locked
  • Question
Sum of All Primes
Replies
0
Views
83
CrxC01
CrxC01
CrxC01
  • Locked
  • Question
Sum of all primes numbers
Replies
6
Views
148
CrxC01
CrxC01
damipera
  • Locked
  • Question
Checkboxes - At Least 1 is Selected? 1
Replies
2
Views
97
damipera
damipera
emmals
  • Locked
  • Question
Auto Click Button and pass through all data
Replies
0
Views
73
emmals
emmals

Part and Inventory Search

Sponsor

Back
Top