PDA

View Full Version : radio button selection complication


havey
04-25-2003, 10:06 PM
need to use radio buttons only, and need 3 sets, if you view this code in your favorite browser you will see 3 sets when you try it: (i need two options for 2nd set (r2), 2 options for the 3rd set (r3) and the first set has one option (r1) that will deselect either 2nd or 3rd set when it is selected and that will be deselected when either 2nd or 3rd set is selected, hope this clears things up.)
this is what i have which doesn't work.... please help!

<html>
<head>
<SCRIPT LANGUAGE="JavaScript"><!--
function clear() {
if(document.f4.ed1.checked == true) {
document.f4.ed2.checked = false;
document.f4.ed3.checked = false;
} else {
if(document.f4.ed2.checked == true) {
document.f4.ed1.checked = false;
} else {
if(document.f4.ed3.checked == true) {
document.f4.ed1.checked = false;
}
}
}
}
//-->
</SCRIPT>
</head>
<body>
<form name="f4">
<p>r1<input type="radio" value="0" name="ed1" onClick="clear()"></p>
<p>r2 option a<input type="radio" name="ed2" value="8"></p>
<p>r2 option b<input type="radio" name="ed2" value="10"></p>
<p>r3 option a<input type="radio" name="ed3" value="8"></p>
<p>r3 option b<input type="radio" name="ed3" value="10"></p>
<p><input type="submit" value="Submit"></p>
</form>

</body>
</html>

cheesebagpipe
04-25-2003, 10:33 PM
The use of radio buttons in groups (two or more) is pretty much mandatory; in addition to being engineered into their behavior, it's counterproductive to confuse your users.

<html>
<head>
<SCRIPT LANGUAGE="JavaScript"><!--
function unsetRadios() {
for (var i=0,j,rad; i<arguments.length; ++i) {
grp = arguments[i], j = 0;
while (rad = grp[j++]) rad.checked = false;
}
}

//-->
</SCRIPT>
</head>
<body>
<form name="f4">
<p>r1<input type="checkbox" value="0" name="ed1" onClick="unsetRadios(ed2,ed3)"></p>
<p>r2 option a<input type="radio" name="ed2" value="8" onclick="if(this.checked)ed1.checked=false"></p>
<p>r2 option b<input type="radio" name="ed2" value="10" onclick="if(this.checked)ed1.checked=false"></p>
<p>r3 option a<input type="radio" name="ed3" value="8" onclick="if(this.checked)ed1.checked=false"></p>
<p>r3 option b<input type="radio" name="ed3" value="10" onclick="if(this.checked)ed1.checked=false"></p>
<p><input type="submit" value="Submit"></p>
</form>
</body>
</html>

havey
04-25-2003, 10:49 PM
cheesebagpipe, you rock !

thank you, thank you very much, I used cell colors to let the user know that two of the sets are "this OR that" type selections.

Have a great weekend !