View Full Version : Hopefully very easy radio button question

05-27-2004, 07:39 PM
Hi Everybody,

I'm new to all of this and I'm hoping this question is very simple.

I have 4 radio buttons:

Selection A
Selection A1
Selection A2
Selection B

If you select A, you would then have to select A1 or A2. But, if you select B, A, A1 & A2 would be cleared of any previous selections. From my research I'm assuming A&B should be one group of radio buttons and A1 & A2 should be a sub-group of A. What's throwing me off is where to put the javascript code and how it should be written. If anybody could assist me, I'd appreciate it.


Willy Duitt
05-27-2004, 10:06 PM
Since you only have the four radio buttons I do not see a need for any loops. Elsewise, I would have wrote it differently.

Try this:

<script type="text/javascript">
function chkForm(form){
var subMenu = document.getElementById('subMenu');
form.subA[0].checked = false;
form.subA[1].checked = false;
subMenu.style.display = 'none';
} else{ subMenu.style.display = 'block' };

function validate(form){
if(!form.main[0].checked && !form.main[1].checked){
alert('You must choose either radio A or B');
return false;

if(form.main[0].checked && !form.subA[0].checked && !form.subA[1].checked){
alert('You must choose a Group A Submenu Button');
return false;
} return true;

<body onload="document.getElementById('subMenu').style.display='none'">
<div><form method="get" action="" onsubmit="return validate(this)">
A: <input type="radio" name="main" value="A" onclick="chkForm(this.form)"><br>
<span id="subMenu" style="display:block">
&nbsp;&nbsp;A1: <input type="radio" name="subA" value="A1"><br>
&nbsp;&nbsp;A2: <input type="radio" name="subA" value="A2"><br>
B: <input type="radio" name="main" value="B" onclick="chkForm(this.form)"><br>
<input type="submit" value="Submit">