I'm trying to set up a redirect after my form validation script runs. But when I click submit it throws my requires a valid email error and then redirects skipping my validation checks.
Currently I've tried adding the function in at the bottom of my js file. But it redirects with out running the validations.
HTML
<button class="popup-button" onclick="openForm()">Open Form</button>
<div class="form-popup" id="form">
<form id="form" onsubmit="return formValidate(event)">
<p>
<input type="text" id="e-mail" placeholder="Email" />
</p><p>
<input type="password" id="pswd" placeholder="Password" />
</p>
<br>
<input id="submitButton" type="submit" class="submit"
onclick="redirect()">
<br>
<button type="button" class="btn cancel"
onclick="closeForm()">Close</button>
</form>
JS
function formValidate(event) {
event.preventDefault();
var form = document.getElementById('form');
var email = document.getElementById('e-mail').value;
var password = document.getElementById('pswd').value;
var emailRGEX = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
var emailResult = emailRGEX.test(email);
//validate Email
if(emailResult == false){
alert("Please enter a valid email address");
return false;
}
//validate lower case
var lowerCaseLetters = /[a-z]/g;
if(password.match(lowerCaseLetters) == null) {
alert("Password needs a lower case!");
return false;
}
//validate upper case
var upperCaseLetters = /[A-Z]/g;
if(password.match(upperCaseLetters) == null){
alert("Password needs an upper case!");
return false;
}
//validate numbers
var numbers = /[0-9]/g;
if(password.match(numbers) == null){
alert("Password needs a number!");
return false;
}
//validate special characters
var special = /[!@#$%^&*(),.?":{}|<>]/g;
if(password.match(special) == null){
alert("Password needs a special character!");
return false;
}
//validate password length
if(password.length<8) {
alert("Password needs to be at least 8 characters");
return false;
}
form.submit();
}
function redirect(){
window.location.href="thankyou.html";
}
I expect the form to redirect to my thankyou.html page after running the validation checks.
Put the redirect in the validation function before form.submit
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments