There is a form and the form validation is done through JavaScript.
While clicking submit the JavaScript function should get executed but it doesn’t.
<form id="form" onsubmit="return validation()" target="_top" action="submission.html">
<label for="name">Name<span style="color:red;">*</span>:</label>
<input type="text" id="name" name="name"><br><br>
<label for="add">Address<span style="color:red;">*</span>:</label>
<input type="text" id="add" name="address"><br><br>
<label for="zip">Zip Code<span style="color:red;">*</span>:</label>
<input type="text" id="zip" name="zip"><br><br>
<label for="country">Country<span style="color:red;">*</span>:</label>
<select id="country" name="country">
<option value="">Please select</option>
<option value="india">india</option>
<option value="US">US</option>
</select><br>
<p>Gender:<span style="color:red;">*</span>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label>
</p>
<p>Preferences:<span style="color:red;">*</span>
<input type="checkbox" id="colour1" name="red" value="red">
<label for="colour1">Red</label>
<input type="checkbox" id="colour2" name="green" value="green">
<label for="colour2">Green</label>
<input type="checkbox" id="colour3" name="blue" value="Blue">
<label for="colour3">Blue</label>
</p><br>
<label for="phone">Phone<span style="color:red;">*</span>:</label>
<input type="phone" id="phone" name="phone"><br><br>
<label for="email">Email<span style="color:red;">*</span>:</label>
<input type="email" name="email" id="email"><br><br>
<label for="pass">Password(6-8 characters)<span style="color:red;">*</span>:</label>
<input type="text" name="password" id="pass"><br><br>
<label for="verpass">Verify Password<span style="color:red;">*</span>:</label>
<input type="text" name="Verfiy Password" id="verpass"><br><br>
<button type="submit" value="Submit">Submit</button>
<input type="reset" value="Clear">
</form>
<script>
function validation() {
let zip=document.getElementById("zip").value;
let email=document.getElementById("email").value;
let email1=email.slice(-4);
let index=email.indexof("@");
let pass=document.getElementById("pass").value;
let pass1=document.getElementById("verpass").value;
var form = document.getElementById("form").elements;
for(var i=0;i<form.length;i++)
{
if(form[i].value=="")
{
alert(form[i].name+" must not be empty");
return false;
}
}
if(isNaN(zip))
{
alert("Enter a valid zip code");
return false;
} else if(email1!=".com"||index==-1)
{
alert("Enter a valid email");
return false;
} else if(pass.length<6||pass.length>8)
{
alert("Enter a valid password");
return false;
} else if(pass!=pass1)
{
alert("Password doesnt match");
return false;
} else
{
return true;
}
}
</script>
