...

View Full Version : Checkboxes



Chames
12-29-2005, 11:05 PM
Here is the code I currently have (I took out a lot of the options to make it less code)


<form name="effects" action="" method="POST">
<input type="checkbox" name="box[]" value="1">Army change name<br>
<input type="checkbox" name="box[]" value="2">Army damage<br>
<input type="submit" name="check" value="SEND">
</form>

I can't get the "check all" and "uncheck all" script to work with this code, any help? Also can I have a "group select" button. Example:

([]=checkbox) ([button])


[check all]
[uncheck all]

[]Select all army
[] army...
[] army...
[] army...
[] army...

[]Select all QV
[] QV...
[] QV...
[] QV...

Thats the basic layout I want. Thanks for all the help!

vwphillips
12-29-2005, 11:42 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
function CkAllNone(f,obj){
var eles=f.elements;
for (zxc0=0;zxc0<eles.length;zxc0++){
if (eles[zxc0].type=='checkbox'){
eles[zxc0].checked=obj.checked
}
}
}

function CkAllNoneName(f,obj){
var eles=f.elements;
for (zxc0=0;zxc0<eles.length;zxc0++){
if (eles[zxc0].type=='checkbox'&&eles[zxc0].name==obj.name){
eles[zxc0].checked=obj.checked
}
}
}
//-->
</script>
</head>

<body>
<form name="effects" action="" method="POST">
<input type="checkbox" name="box1[]" value="1">Army change name<br>
<input type="checkbox" name="box[]" value="1">Army change name<br>
<input type="checkbox" name="box[]" value="2">Army damage<br>
<input type="checkbox" value="2" name="box[]" onclick="CkAllNoneName(this.form,this);" >check All/None this name<br>
<input type="checkbox" value="2" onclick="CkAllNone(this.form,this);" >check All/None<br>
<input type="submit" name="check" value="SEND">
</form>
</body>

</html>

Chames
12-30-2005, 12:22 AM
Wow... uhh... thanks a ton.

Bill Posters
12-30-2005, 12:45 AM
Fwiw…

e.g.

toggler.js

function toggleAll(trgtEl,checkVal) {

var obj = document.getElementById(trgtEl);
var inputs = obj.getElementsByTagName('input');

for (var i=0; i<inputs.length; i++) {
if (inputs[i].type == 'checkbox') {
inputs[i].checked = (trgtEl=='checkForm') ? checkVal : document.getElementById('toggle-'+trgtEl).checked;
}
}

}

markup

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript" src="toggler.js"></script>
</head>
<body>

<form action="/" method="post" id="checkForm">

<fieldset id="controls">

<button type="button" value="check all" onclick="toggleAll('checkForm',true);">Check all</button><br />
<button type="button" value="uncheck all" onclick="toggleAll('checkForm');">Uncheck all</button>

</fieldset>

<fieldset id="army">

<label><input type="checkbox" onchange="toggleAll('army');" id="toggle-army" /> Select all Army</label><br /><br />
<label><input type="checkbox" /> Army...</label><br />
<label><input type="checkbox" /> Army...</label><br />
<label><input type="checkbox" /> Army...</label><br />
<label><input type="checkbox" /> Army...</label><br />

</fieldset>

<fieldset id="qv">

<label><input type="checkbox" onchange="toggleAll('qv');" id="toggle-qv" /> Select all QV</label><br /><br />
<label><input type="checkbox" /> QV...</label><br />
<label><input type="checkbox" /> QV...</label><br />
<label><input type="checkbox" /> QV...</label><br />
<label><input type="checkbox" /> QV...</label><br />

</fieldset>

</form>

</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum