Javascript Validator

Can anybody tell me why my javascript validator won't work?
I'm working with a very simple form, but it is on a div that I want to disappear once the form has been validated.
I think the form is disappearing before it submits the form..



here is the code for my form:

<div id="modalWdw">

<form id="form1" name="form1" method="post" action="popup.htm">

<p>Which Radio Station did you hear us on? </p>
<p><label><input type="radio" name="Group1" value="Station a" />
Station A </label>
<br />
<label><input type="radio" name="Group1" value="Station b" />
Station B </label>
<br />
<label><input type="radio" name="Group1" value="Station C" />
Station C </label>
<br />
<input type="radio" name="Group1" value="Station C" />
None</label>
<br /></p>

<input type="submit" value="Submit" onclick="(doValidate() ? hideModal() : return true);">
 </form>
 </div>

and this is the javascript (which is on the bottom of the page, not in the head as it is supposed to be because of the way the div appears/disappears depending on the form being submitted, it also appears only if sent from a certain link):

 var modal = document.getElementById('modalWdw');
 
   
    function showModal()
    {
       modal.style.display='block';
    }

    function hideModal()
    {
       modal.style.display='none';
       return true;
    }
	
	function doValidate()
	{
		var group1Checked;

		for (var i=0; i<document.form.group1.length; i++)
		{
	
		if (document.form.group1[i].checked)
		{
			group1Checked = document.form.group1[i].value;
		   }
		}

	
		if(!group1Checked)
		{ //if group1Checked does not equal null
			alert("You did not make a selection.")
		}
		else
		{
			return true;
		}
	}	

	showModal();

can anyone see the problem, if im missing any vital info for you to understand what's going on.


Any comments are appreciated!