I want my form to use JavaScript to provide form validation. I can't see why it isn't working? Any help would be greatly appreciated My code is <html>
<head>
<script type="text/javascript">
function validateForm()
{
//Variable declarations for form inputs
var f=document.forms["myForm"]["fname"].value;
var s=document.forms["myForm"]["sname"].value;
var u=document.forms["myForm"]["uname"].value;
var e=document.forms["myForm"]["email"].value;
var u=document.forms["myForm"]["address"].value;
var p=document.forms["myForm"]["pass"].value;
var p2=document.forms["myForm"]["pass2"].value;
var i=document.forms["myForm"]["info"].value;
var atsymb=e.indexOf("@");
var dotsymb=e.lastIndexOf(".");
if (f==null || f=="")
{
document.getElementById("valAlert").innerHTML="Oops, you forgot to tell us your first name";
return false;
}
else if (s==null || s==""){
document.getElementById("valAlert").innerHTML="You must have a surname, unless you're Pele";
return false;
}
else if (u==null || u==""){
document.getElementById("valAlert").innerHTML="You must have a username";
return false;
}
else if (e==null || e=="" || atsymb<1 || dotsymb<atsymb+2>=e.length){
document.getElementById("valAlert").innerHTML="We require an email address in order to spam you to our hearts content";
return false;
}
else if (u==null || u=="" || u.length < 6){
document.getElementById("valAlert").innerHTML="Come on tell us your address (all of it), we won't stalk you...";
return false;
}
else if (p.length < 6 || p==null || p==""){
document.getElementById("valAlert").innerHTML="Password must be greater then 6 characters! Otherwise anybody would be able to hack in!";
return false;
}
else if (p2.length < 6 || p2==null || p2==""){
document.getElementById("valAlert").innerHTML="Classic mistake, make sure your re-type is greater then 6 characters";
return false;
}
else if (p != p2){
document.getElementById("valAlert").innerHTML="Do you think we were born yesterday? Your passwords don't even match!";
return false;
}
else if (i==null || i=="" ||i <10){
document.getElementById("valAlert").innerHTML="You must tell us more";
return false;
} else{
alert(
f + " Welcome ");
}
</script>
</head>
<body>
<form name="myForm" id="Student_Form" onsubmit="return validateForm()">
<input id="fname" type="text" name="fname" placeholder=" First Name">
<input id="sname" type="text" name="sname" placeholder=" Surname">
<input id="uname" type="text" name="uname" placeholder=" User Name">
<input type="email" name="email" id="email" placeholder="Email Address">
<input type="password" name="pass" id="Password" placeholder="pass">
<input type="password" name="pass2" id="pass2" placeholder="Confirm Password">
<textarea name="info" id="info" placeholder="Tell us about yourself"></textarea>
<input type="submit" name="send" value="Submit" id="submit" class="button">
<input type="Reset" name="Reset" value="Reset Form" id="Reset" class="button">
</form>
</body>
</html>
Submit an article or tip