[SalesForce] Smart Capture Form Field validation on ExactTarget using JavaScript

I have a landing page that contains a Smart Capture form that sends data back to a custom Object in Salesforce. The form is functional and works as needed. I would like to add custom JavaScript code to my page to validate the form data entered by users. I have my JS in place but it does nothing to valiate form data. I am not a JS programmer so I am probably missing something. Here is the example I am attempting to follow:
http://help.exacttarget.com/en/documentation/exacttarget/subscribers/smart_capture/javascript_and_smart_capture/using_javascript_to_validate_fields_in_a_smart_capture_form/

Here is my form code:

<form onsubmit="return validate()" action="%%= RequestParameter('PAGEURL') =%%" method="POST" name="myform">
    <script type="text/javascript">
    function validate() 
    { 
    var fname=document.getElementById("First_Name__c").value; 
    var lname=document.getElementById("Last_Name__c").value; 
    var email=document.getElementById("Email__c").value; 
    var phone=document.getElementById("Phone__c").value; 
    var preference=document.getElementById("Preference__c").value; 
    submitOK="true"; 
    if (fname.length<1) 
    {  
    var Valert = "Please Enter your First Name \n"; 
    submitOK="false"; 
    }  
    else 
    { 
    var Valert = ""; 
    } 
    if (lname.length<1) 
    { 
    Valert = Valert + "Please Enter your Last Name \n"; 
    submitOK="false"; 
    } 
    if (phone.length<10)
    { 
    Valert = Valert + "Please Enter a Valid 10 digit Phone Number \n"; 
    submitOK="false"; 
    }
    if (email.length<5)
    { 
    Valert = Valert + "Please Enter a valid Email Address \n"; 
    submitOK="false"; 
    }
    if (preference.length<1)
    { 
    Valert = Valert + "Please indicate a Preference \n"; 
    submitOK="false"; 
    }
    if (submitOK=="false") 
    { 
    alert(Valert); 
    return false; 
    } 
    } 
    </script>
    <div>
    <div>
    <b>First Name</b>
    </div>
    <div>
    <input type="text" size="75" value="" id="First_Name__c" name="First_Name__c" maxlength="75" />
    </div>
    </div>
    <div>
    <div>
    <div>
    <b>Last Name</b>
    </div>
    <div>
    <input type="text" maxlength="75" name="Last_Name__c" id="Last_Name__c" value="" size="75" />
    </div>
    </div>
    <br />
    <div>
    <div>
    <b>Email</b>
    </div>
    <div>
    <input type="text" maxlength="80" name="Email__c" id="Email__c" value="" size="75" />
    </div>
    <div>
    &nbsp;
    <div>
    <div>
    <b>Phone</b>
    </div>
    <div>
    <input type="text" size="75" value="" id="Phone__c" name="Phone__c" maxlength="40" />
    </div>
    <div>
    &nbsp;
    <div>
    <div>
    <b>Preference</b>
    </div>
    <div>
    <div>
    <input type="radio" name="Preference__c" id="Preference__c_DVD" value="DVD" />&nbsp;<span>DVD</span>
    </div>
    <div>
    <input type="radio" name="Preference__c" id="Preference__c_Digital" value="Digital" />&nbsp;<span>Digital</span>
    </div>
    <div>
    <input type="radio" name="Preference__c" id="Preference__c_DVD and Digital" value="DVD and Digital" />&nbsp;<span>DVD and Digital</span>
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    <input type="submit" value="Submit" />
    </div>
    <span id="post_code" style="display: none;">%%[[name="FormPost";type="POST"]  ]%%</span>
    <input type="hidden" name="__successPage" id="__successPage" value="" /><input type="hidden" name="__errorPage" id="__errorPage" value="" /><input type="hidden" name="__contextName" id="__contextName" value="FormPost" /><input type="hidden" name="__executionContext" id="__executionContext" value="Post" /><input type="hidden" name="SubscriberKey__c" id="SubscriberKey__c" value="" />
</form>
<span style="display: none;" id="post_code">%%[[name="FormPost";type="POST"]  ]%%</span><span id="post_code" style="display: none;"><!-- AMP Processing Placeholder DO NOT REMOVE --></span>