PDA

View Full Version : a question for adios (or someone equally as sharp) regarding check/uncheck all script

hedbanger
10-29-2002, 07:37 PM
starting a fresh thread with a new question on the topic of checkboxes.
the page that the checkboxes appear on is part of a dynamic search.
i find that some of the results return with only 1 subclass and therefore only 1 checkbox. but the checkall/uncheckall button doesn't work when there's only one so i would like to omit the button when there is only a single checkbox. how would you do that?
thanks.


here's the script:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>check it out</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- // Begin
function check_uncheck_all(button, name) {
var box, e = 0, grp = button.form[name];
while (box = grp[e++]) box.checked = (button.value == 'Check All');
return (button.value == 'Check All') ? 'Uncheck All' : 'Check All';
}
// End -->
</script>
</head>
<body>
<FORM ACTION="" METHOD="POST" ENCTYPE="application/x-www-form-urlencoded">
<!-- -->
<br>
<table width="150" border="0" align="center" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td align="center">SET 1</td>
</tr>
<tr>
<td align="center">
<input name="button1"type="button" style="COLOR: #24559E; BACKGROUND-COLOR: #ffffff; WIDTH: 100px;" onClick="this.value=check_uncheck_all(this,'SRP2')" value="Check All">
<br>
<br>
<br>
<br>
<br>
</td>
</tr>
<tr>
<td align="left">
<input type="checkbox" name="SRP2" value="1">
A<br>
<input type="checkbox" name="SRP2" value="2">
B<br>
<input type="checkbox" name="SRP2" value="3">
C<br>
</td>
</tr>
</table>
<p> </p>
<p><br>
</p>
</form>
<FORM ACTION="" METHOD="POST" ENCTYPE="application/x-www-form-urlencoded">
<table width="150" border="0" align="center" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td align="center">SET 2</td>
</tr>
<tr>
<td align="center">
<input name="button2"type="button" style="COLOR: #24559E; BACKGROUND-COLOR: #ffffff; WIDTH: 100px;" onClick="this.value=check_uncheck_all(this,'SRP2[]2')" value="Check All">
<br>
<br>
<br>
<br>
<br>
</td>
</tr>
<tr>
<td align="left">
<input type="checkbox" name="SRP2[]2" value="1">
? <br>
<input type="checkbox" name="SRP2[]2" value="2">
?<br>
<input type="checkbox" name="SRP2[]2" value="3">
O<br>
</tr>
</table>
</form>
</body>
</html>
beetle
10-29-2002, 07:46 PM
This perhaps?function check_uncheck_all(button, name) {
var box, e = 0, grp = button.form[name];
if (typeof grp[0] == 'undefined')
while (box = grp[e++])
box.checked = (button.value == 'Check All');
else
grp.checked = (button.value == 'Check All');
return (button.value == 'Check All') ? 'Uncheck All' : 'Check All';
}
hedbanger
10-29-2002, 10:24 PM
hmmm... that doesn't seem to work at all.

one fix, i've discovered is to put a hidden field in so that there's always more than 1, if there's any.


<input type="checkbox" name="SRP2[]2" value="1">1
<input type="hidden" name="SRP2[]2" value="2">
beetle
10-29-2002, 10:33 PM
Darn typos! function check_uncheck_all(button, name) {
var box, e = 0, grp = button.form[name];
if (typeof grp[0] != 'undefined')
while (box = grp[e++])
box.checked = (button.value == 'Check All');
else
grp.checked = (button.value == 'Check All');
return (button.value == 'Check All') ? 'Uncheck All' : 'Check All';
}
Mr J
10-29-2002, 10:56 PM
Not to sure about this but ............ may put you on the right track




<SCRIPT LANGUAGE="JavaScript">
<!-- // Begin
count=0
function init(){

for(f=0;f<document.forms.length;f++){

for (i = 0; i < document.forms[f].length; i++) {
if (document.forms[f][i].type == "checkbox"){
count++
}
if(count==1){
document.forms[f].button1.style.visibility="hidden"
}
}
}
}
setTimeout("init()",1000)

function check_uncheck_all(button, name) {
var box,
e = 0,
grp = button.form[name];
while (box = grp[e++]) box.checked = (button.value == 'Check All');
return (button.value == 'Check All') ? 'Uncheck All' : 'Check All';
}
// End -->
</script>
</head>
<body>
<FORM ACTION="" METHOD="POST" ENCTYPE="application/x-www-form-urlencoded">
<!-- -->
<br>
<table width="150" border="0" align="center" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td align="center">SET 1</td>
</tr>
<tr>
<td align="center">
<input name="button1"type="button" style="COLOR: #24559E; BACKGROUND-COLOR: #ffffff; WIDTH: 100px;" onClick="this.value=check_uncheck_all(this,'SRP2')" value="Check All">
<br>
<br>
<br>
<br>
<br>
</td>
</tr>
<tr>
<td align="left">
<input type="checkbox" name="SRP2" value="1">
A<br>

</td>
</tr>
</table>
<p> </p>
<p><br>
</p>
</form>
<FORM ACTION="" METHOD="POST" ENCTYPE="application/x-www-form-urlencoded">
<table width="150" border="0" align="center" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td align="center">SET 2</td>
</tr>
<tr>
<td align="center">
<input name="button1"type="button" style="COLOR: #24559E; BACKGROUND-COLOR: #ffffff; WIDTH: 100px;" onClick="this.value=check_uncheck_all(this,'SRP2[]2')" value="Check All">
<br>
<br>
<br>
<br>
<br>
</td>
</tr>
<tr>
<td align="left">
<input type="checkbox" name="SRP2[]2" value="1">
? <br>
</tr>
</table>
</form>
</body>
</html>
hedbanger
10-29-2002, 11:15 PM
beetle, your corrected one does work to allow checking even if there's only one checkbox in the set.

mr j, i tested yours with a page with sets of checkboxes numbering 3, 1 and 3.
the second set should have lost the button, but it didn't. and the first set should not have lost the button but it did.
beetle
10-29-2002, 11:17 PM
Ya, I knew it would....see? Just ONE tiny error, and KABOOM! :D
hedbanger
10-29-2002, 11:25 PM
lol!
hardly a tiny error!
tiny character -- yes.
(like i have any right to comment!):)

so, what do you think about mr j's script? can that be fixed?
RadarBob
10-29-2002, 11:52 PM
First I have to say that I hate convoluted, cutsey coding. Now that I've gotten that off my chest...

(A) OK, as I understand it you want two buttons. one will check all the checkboxes and the second will uncheck all the checkboxes, yes?
OR
(B) Are you trying to have only one button and it will either "check all" or "uncheck all" based on some condition?

Let's do A..

Let's assume you have n checkboxes all named "SPR2"


function check_all (theForm) {
for (x=0; x<theForm.SPR2.length; x++) {
theForm.SPR2[x].checked = true;
}
}

function Uncheck_all (theForm) {
for (x=0; x<theForm.SPR2.length; x++) {
theForm.SPR2[x].checked = false;
}
}
<form name="myform">
. . .
<input type="checkbox" name="SPR2" value="1">
<1-- repeat checkboxes as needed **all with the same name**-->

. . .

<input type="button" name="checkers"... value=" Check All " onclick="check_all(myform);">

<!-- second button similar to the first but w/ different name -->
</form>


If you want to do B then...


function check_all (theForm) {
for (x=0; x<theForm.SPR2.length; x++) {
theForm.SPR2[x].checked = true;
}
theForm.checkers.value = " UnCheck All ";
theForm.checkers.onclick="Uncheck_all(myform);"
}

function Uncheck_all (theForm) {
for (x=0; x<theForm.SPR2.length; x++) {
theForm.SPR2[x].checked = false;
}
theForm.checkers.value = " Check All ";
theForm.checkers.onclick="check_all(myform);"
}


and use only one button

Am I even close to the issue/problem?:confused:
hedbanger
10-30-2002, 12:11 AM
radarbob,
not 2 buttons per form. 1 button per form that does check/uncheck except where the form contains only a single box.

what it is, is a way of doing a search for subcategories.
first a dropdown box (set to multi) allows the user to select from about a dozen categories then displays all of the selected categories and their subcategories. the subcategories can contain anywhere from 1 to 30 items per category. there are about 150 subcategories total.
a typical result of the first step would display 20 subcategories in the first category and 1 subcategory in the second category. then the selection is made from them with the use of the check/uncheck all button and adding or removing checks from checkboxes by hand. then a single submit button builds a sales report.

i'm going to try out your code to see what it does.
Mr J
10-30-2002, 02:28 PM
Sorry hedbanger.

I realised it had a problem after I had submitted

I checked it just using one checkbox and then after I thought I'd better try it with more and realised I had not solved your problem after all.
Mr J
10-30-2002, 06:14 PM
Please try this amended script.

When there is only one checkbox the button is hidden.


Note, my browser is IE5.5



<html>
<head>
<title>check it out</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- // Begin
count=0
function init(){

for(f=0;f<document.forms.length;f++){

for (i = 0; i < document.forms[f].length; i++) {
if (document.forms[f][i].type == "checkbox"){
count++
}
}
if(count>1){
document.forms[f].button1.style.visibility="visible"
count=0
}
else{
document.forms[f].button1.style.visibility="hidden"
count=0
}
}
}
setTimeout("init()",1000)

function check_uncheck_all(button, name) {
var box,
e = 0,
grp = button.form[name];
while (box = grp[e++]) box.checked = (button.value == 'Check All');
return (button.value == 'Check All') ? 'Uncheck All' : 'Check All';
}
// End -->
</script>
</head>
<body>
<FORM name=f1 ACTION="" METHOD="POST" ENCTYPE="application/x-www-form-urlencoded">
<!-- -->
<br>
<table width="150" border="0" align="center" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr><td align="center">SET 1</td></tr>
<tr><td align="center">
<input name="button1"type="button" style="COLOR: #24559E; BACKGROUND-COLOR: #ffffff; WIDTH: 100px;" onClick="this.value=check_uncheck_all(this,'SRP2')" value="Check All"><br><br><br><br><br></td>
</tr>
<tr><td align="left">
<input type="checkbox" name="SRP2" value="1">A<br>
<input type="checkbox" name="SRP2" value="2">B<br>
<input type="checkbox" name="SRP2" value="3">C<br>
</td>
</tr></table>
<p></p><p><br></p>
</form>

<FORM ACTION="" METHOD="POST" ENCTYPE="application/x-www-form-urlencoded">
<table width="150" border="0" align="center" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC">
<tr><td align="center">SET 2</td></tr>
<tr>
<td align="center">
<input name="button1"type="button" style="COLOR: #24559E; BACKGROUND-COLOR: #ffffff; WIDTH: 100px;" onClick="this.value=check_uncheck_all(this,'SRP2[]2')" value="Check All"><br><br><br><br><br></td>
</tr>
<tr>
<td align="left">
<input type="checkbox" name="SRP2[]2" value="1">A<br>
<input type="checkbox" name="SRP2[]2" value="2">B<br>
<input type="checkbox" name="SRP2[]2" value="3">C<br>
</td>
</tr></table>
</form>
</body></html>
hedbanger
10-30-2002, 06:40 PM
well, at least we've got two (count 'em TWO!) methods for getting the single checkboxes to work!

our temporary fix is to put all of the tables in a single form and check/uncheck ALL.
hedbanger
10-30-2002, 06:58 PM
mr j,
that is lovely.
and fortunately this is for an intranet, and we only support ie.
thank you. i will pass on the good will by helping others in ways that i can.


now we've got to get the jsp to work properly. it gets all of the input but it only displays the info from the first form...
arghh!