Click to See Complete Forum and Search --> : checkbox validation


lito
03-20-2003, 01:27 AM
Im building a dating site in php and vould like to add some functionality with javascript. What I'm trying to achive here is when 'Any' checkbox is checked all the checkboxes in the 'p_hair[]' array should get checked and if you were to uncheck a checkbox in that array you would automatically uncheck 'Any'. Well here is my code and im gettign errors I dont know why (it has been couple of years since i last touched javascript to do forms)

<html>
<head>
<title> checkbox validate </title>
<script language="JavaScript">
<!--
// function accepts object and number of indexes in the array -1
function uncheckBox(o,i){
var objForm = document.forms[0];
var objName = o.name;
if(i == 0){
objForm.objName[0].checked = false;
} else {
for(var n=1;n<=i;n++){
objForm.objName[n].checked = true;
}
}
}

//-->
</script>
</head>

<body>
<form name="myForm">
Select your preferences...<br><br>
Hair<br>
<input type="checkbox" name="p_hair" value="any" onClick="uncheckBox(this,5)" checked> Any<br>
<input type="checkbox" name="p_hair" value="black" onClick="uncheckBox(this,0)"> Black<br>
<input type="checkbox" name="p_hair" value="blonde" onClick="uncheckBox(this,0)"> Blonde<br>
<input type="checkbox" name="p_hair" value="brown" onClick="uncheckBox(this,0)"> Brown<br>
<input type="checkbox" name="p_hair" value="gray" onClick="uncheckBox(this,0)"> Gray<br>
<input type="checkbox" name="p_hair" value="salt&peper" onClick="uncheckBox(this,0)"> Salt&Peper<br>

<br>

Eyes<br>
<input type="checkbox" name="p_eyes" value="any" onClick="uncheckBox(this,3)" checked> Any<br>
<input type="checkbox" name="p_eyes" value="blue" onClick="uncheckBox(this,0)"> Blue<br>
<input type="checkbox" name="p_eyes" value="green" onClick="uncheckBox(this,0)"> Green<br>
<input type="checkbox" name="p_eyes" value="brown" onClick="uncheckBox(this,0)"> Brown<br>

</form>
</body>
</html>

gil davis
03-20-2003, 06:18 AM
Radio buttons would do that for you automatically.

However, this function will do what you want:function uncheckBox(o,i){
for (var i=0; i<o.form[o.name].length; i++)
{if (o.form[o.name][i].checked) o.form[o.name][i].checked = false;}
o.checked = true;
}

lito
03-21-2003, 12:21 AM
thanks to your insight i got my answer, your code is not exactly what I wanted but its nice to know you can use chekbox as a radio button ;) What I initially wanted is to check as many as apply but do noct have 'Any' checkbox checked if not all checkboxes in the array were selected. Thanks again and here is a working version in case some one else is looking for it.

<html>
<head>
<title> checkbox validate </title>
<script language="JavaScript">
<!--
// function accepts object and number of indexes in the array -1
function uncheckBox(o,i){
var objForm = document.forms[0];
var objName = o.name;
if(i == 0){
o.form[o.name][0].checked = false;
} else {
for(var n=1;n<=i;n++){
o.form[o.name][n].checked = true;
}
}
}
//-->
</script>
</head>

<body>
<form name="myForm">
Select your preferences...<br><br>
Hair<br>
<input type="checkbox" name="p_hair[]" value="any" onClick="uncheckBox(this,5)" checked> Any<br>
<input type="checkbox" name="p_hair[]" value="black" onClick="uncheckBox(this,0)"> Black<br>
<input type="checkbox" name="p_hair[]" value="blonde" onClick="uncheckBox(this,0)"> Blonde<br>
<input type="checkbox" name="p_hair[]" value="brown" onClick="uncheckBox(this,0)"> Brown<br>
<input type="checkbox" name="p_hair[]" value="gray" onClick="uncheckBox(this,0)"> Gray<br>
<input type="checkbox" name="p_hair[]" value="salt&peper" onClick="uncheckBox(this,0)"> Salt&Peper<br>

<br>

Eyes<br>
<input type="checkbox" name="p_eyes[]" value="any" onClick="uncheckBox(this,3)" checked> Any<br>
<input type="checkbox" name="p_eyes[]" value="blue" onClick="uncheckBox(this,0)"> Blue<br>
<input type="checkbox" name="p_eyes[]" value="green" onClick="uncheckBox(this,0)"> Green<br>
<input type="checkbox" name="p_eyes[]" value="brown" onClick="uncheckBox(this,0)"> Brown<br>

</form>
</body>
</html>