<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Javascript Intro</title>



<script type="text/javascript">
function loopForm() {
    var cbResults = false;
    var radioResults = false;

    for (var i = 0; i < document.contact.elements.length; i++ ) {
        if (document.contact.elements[i].type == 'checkbox') {
            if (document.contact.elements[i].checked == true) {
                cbResults = true;
            }
        }
        if (document.contact.elements[i].type == 'radio') {
            if (document.contact.elements[i].checked == true) {
                radioResults = true;
            }
        }
    }

    if (cbResults == false){
    alert("checkbox problem!");
    return false;
}
 if (radioResults == false){
    alert("radio problem");
    return false;
}

}

function validateMe(){

	var manSwitch = true;	
	var msg = "Please fix the following error(s)<br/>";
	var fname = document.getElementById("fullname").value;
    var email = document.getElementById("email").value;
      

    console.log(document.contact.elements[6].checked);//better way to validate collections



    return loopForm();
    /*even 
    //better way:  if (form.elements[i].type == 'checkbox') {
            if (form.elements[i].checked == true) {
                cbResults += form.elements[i].value + ' ';
            }
        }
     */
	
	if (fname == ""){
		msg += "Correct the first name<br/>";
		manSwitch = false;
	}	
    
    if (email == "" || email.indexOf("@") == -1){
		msg += "Correct your email<br/>";
		manSwitch = false;
	}

	if (manSwitch === false){
		document.getElementById("error").innerHTML = msg;
		return false;
	}
	else{
		return true
	}
}


</script>

<body>
<?php
if ($_POST['submit'] == 'Send Me'){
foreach ($_POST as $key=>$value){
$content .= $key.' '.$value.'<br/>';
  }

mail("kdsecor@gmail.com","Contact Form",$content,"Content-type: text/html");
}
?>





<span id = "error"></span>
<form action = "formharvest.html" method ="post" name = "contact" onSubmit="return validateMe();">
Name: <input type = "text" id = "fullname" /><br/>
Email: <input type = "email" id =  "email" name = "email" /><br/>
Phone: <input type = "tel" name = "phone" /><br/>
Gender: <input type = "radio" name = "gender" value="male"/>Male<br/>
<input type = "radio" name = "gender" value="female"/>Female<br/>
DOB: <input type = "date" name = "dob"/>Male<br/>

Hobbies: <br/>
Coding:<input type = "checkbox" name = "hobbies" value = "Coding"/><br/>
Sleeping:<input type = "checkbox" name = "hobbies" value = "Sleeping"/><br/>
Eating:<input type = "checkbox" name = "hobbies" value = "Eating"/><br/>
US TimeZone: <select name = "timezone">
<option value = "EDT">EDT</option>
<option value = "CST">CST</option>
<option value = "MST">MST</option>
<option value = "PDT">PDT</option>
</select>
<br/>
Comments: <textarea rows = "5" cols="20" name = "comments"></textarea>
<input type = "submit" name = "submit" value = "Send Me"/>
</form>



</body>
</html>