My JavaScript validation code is working fine.
Javascript: All fields return false when re-entering the password, but JavaScript does not return false if it's not working
The Re-Enter password JavaScript code is failing to work...
An alert is displayed ... after the alert is shown, the form gets submitted and return false doesn't work as expected...
[Here is js Fiddle][1]
[1]: https://jsfiddle.net/Ln1cmaps/
**HTML**
<div class="container">
<div class="row main">
<div class="main-login main-center">
<h2>Admin Registration</h2>
<form class="" method="post" action="" name="signup" onsubmit="return validate()">
<div class="form-group">
<label for="name" class="cols-sm-2 control-label">Your Name</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="name" id="name" placeholder="Enter your Name"/>
</div>
</div>
</div>
<div class="form-group">
<label for="email" class="cols-sm-2 control-label">Your Email</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
<input type="email" class="form-control" name="email" id="email" placeholder="Enter your Email"/>
</div>
</div>
</div>
<div class="form-group">
<label for="username" class="cols-sm-2 control-label">Username</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-users fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="username" id="username" placeholder="Enter your Username"/>
</div>
</div>
</div>
<div class="form-group">
<label for="password" class="cols-sm-2 control-label">Password</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
<input type="password" class="form-control" name="password" id="password" placeholder="Enter your Password"/>
</div>
</div>
</div>
<div class="form-group">
<label for="confirm" class="cols-sm-2 control-label">Confirm Password</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
<input type="password" class="form-control" name="confirmpassword" id="confirm" placeholder="Confirm your Password"/>
</div>
</div>
</div>
<div class="form-group ">
<input type="submit" name="submit" value="Register" class="btn btn-primary btn-lg btn-block login-button" />
</div>
</form>
</div>
</div>
</div>
**Javascript Validation Code**
function validate() {
var name = document.signup.name.value.length;
var email = document.signup.email.value.length;
var username = document.signup.username.value.length;
var password = document.signup.password.value;
var rpass = document.signup.confirmpassword.value;
var re =(/^(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])[a-zA-Z0-9!@#$%^&*]{8,16}$/);
if(name=="") {
alert("Please Enter Your Name");
document.signup.name.focus();
return false;
}
if(name<3) {
alert("Please Enter Your Correct Name");
document.signup.name.focus();
return false;
}
if(email=="") {
alert("Please Enter email");
document.signup.email.focus();
return false;
}
if(email<3) {
alert("Please Enter Your Correct email");
document.signup.email.focus();
return false;
}
if(username=="") {
alert("Please Enter Username");
document.signup.username.focus();
return false;
}
if(username<5) {
alert("Please Enter Username at least 5 digit");
document.signup.username.focus();
return false;
}
if(password=="") {
alert("Please Enter Your password");
document.signup.password.focus();
return false;
}
if(!re.test(password)) {
alert("Error: Password Must Contain Atleast One Number,One Special Character & One Upper Case");
document.signup.password.focus();
return false;
}
if(rpass =="") {
alert("Please Enter Your Password Again");
document.signup.rpass.focus();
return false;
}
if(rpass != password) {
alert("Password does'nt Matched");
document.signup.rpass.focus();
return false;
}
else {
return true;
}
}