Hi i need to make sure my password has one capital and one number before it should be able to continue and my code worked for the first few times but it suddenly stopped working after that, anyone able to help? thank you.
Code:
<html>
<head>
<style>
.tooltipContainer { display: none; }
</style>
<script>
function validateFormOnSubmit(theForm) {
var reason = "";
reason += validateUsername(theForm.Username);
reason += validatePassword(theForm.Password);
reason += validateEmail(theForm.Email);
reason += validateEmpty(theForm.Name);
if (reason != "") {
alert("Some fields need correction:\n" + reason);
return false;
}
return true;
}
function validateEmpty(fld) {
var error = "";
if (fld.value.length == 0) {
fld.style.background = 'Yellow';
error = "The required field has not been filled in.\n"
} else {
fld.style.background = 'White';
}
return error;
}
function validateUsername(fld) {
var error = "";
var illegalChars = /\W/; // allow letters, numbers, and underscores
if (fld.value == "") {
fld.style.background = 'Yellow';
error = "You didn't enter a username.\n";
} else if ((fld.value.length < 5) || (fld.value.length > 15)) {
fld.style.background = 'Yellow';
error = "The username is the wrong length.\n";
} else if (illegalChars.test(fld.value)) {
fld.style.background = 'Yellow';
error = "The username contains illegal characters.\n";
} else {
fld.style.background = 'White';
}
return error;
}
function validatePassword(fld) {
var error = "";
var illegalChars = /[\W_]/; // allow only letters and numbers
if (fld.value == "") {
fld.style.background = 'Yellow';
error = "You didn't enter a password.\n";
} else if ((fld.value.length < 7) || (fld.value.length > 15)) {
error = "The password is the wrong length. \n";
fld.style.background = 'Yellow';
} else if (illegalChars.test(fld.value)) {
error = "The password contains illegal characters.\n";
fld.style.background = 'Yellow';
} else if (!((fld.value.search(/(a-z)+/)) && (fld.value.search(/(0-9)+/)))) {
error = "The password must contain at least one numeral.\n";
fld.style.background = 'Yellow';
} else {
fld.style.background = 'White';
}
return error;
}
function trim(s)
{
return s.replace(/^\s+|\s+$/, '');
}
function validateEmail(fld) {
var error="";
var tfld = trim(fld.value); // value of field with whitespace trimmed off
var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;
if (fld.value == "") {
fld.style.background = 'Yellow';
error = "You didn't enter an email address.\n";
} else if (!emailFilter.test(tfld)) { //test email for illegal characters
fld.style.background = 'Yellow';
error = "Please enter a valid email address.\n";
} else if (fld.value.match(illegalChars)) {
fld.style.background = 'Yellow';
error = "The email address contains illegal characters.\n";
} else {
fld.style.background = 'White';
}
return error;
}
function validatePassword(fld) {
var error = "";
var illegalChars = /[\W_]/; // allow only letters and numbers
if (fld.value == "") {
fld.style.background = 'Yellow';
error = "You didn't enter a password.\n";
} else if ((fld.value.length < 7) || (fld.value.length > 15)) {
error = "The password is the wrong length. \n";
fld.style.background = 'Yellow';
} else if (illegalChars.test(fld.value)) {
error = "The password contains illegal characters.\n";
fld.style.background = 'Yellow';
} else if (!((fld.value.search(/(a-z)+/)) && (fld.value.search(/(0-9)+/)))) {
error = "The password must contain at least one numeral.\n";
fld.style.background = 'Yellow';
} else {
fld.style.background = 'White';
}
return error;
}
function validatePhone(fld) {
var error = "";
var stripped = fld.value.replace(/[\(\)\.\-\ ]/g, '');
if (fld.value == "") {
error = "You didn't enter a phone number.\n";
fld.style.background = 'Yellow';
} else if (isNaN(parseInt(stripped))) {
error = "The phone number contains illegal characters.\n";
fld.style.background = 'Yellow';
} else if (!(stripped.length == 10)) {
error = "The phone number is the wrong length. Make sure you included an area code.\n";
fld.style.background = 'Yellow';
}
return error;
}
</script>
</head>
<body>
<form name="demo" onsubmit="return validateFormOnSubmit(this)" method="get" action="FormProcessor.html">
<div class="container">
<div id ="labels">
<label for="Name">Name*:</label>
<input type="text" id="Name" Name="Name" required="required" placeholder="Ayumi chan" class="masterTooltip" title ="Enter your Full Name"/><br>
<div class="tooltipContainer error-name">Name must not be empty.</div><br>
<label for="Email">Email address*:</label>
<input type="Email" id="Email" Name="Email" required="required" placeholder="[email protected]" class="masterTooltip" title="All emails from the system will be sent to the given address. The e-mail address is not made public and will only be used if you wish to receive a new password or certain news/notifications." /><br>
<div class="tooltipContainer error-Email">Email must not be empty.</div><br>
<label for="Username">Username*:</label>
<input type="text" id="Username" Name="Username" required="required" placeholder="TheSpecs" class="masterTooltip" title="Username must be more than 5 letters. Spaces and punctuations are not allowed." /><br>
<div class="tooltipContainer error-Username">Username must not be empty.</div><br>
<label for="Password">Password*:</label>
<input type="Password" id="Password" Name="Password" required="required" placeholder="Ayumi13" class="masterTooltip" title="Password must be more than 7 letters and have at least ONE CAPITAL LETTER and ONE NUMBER." />
<div class="tooltipContainer error-Password">Password must not be empty.</div><br><br>
</div>
<div id="button">
<input type="submit" onclick="myFunction();" value="Submit" />
</div><br>
</form>
</body>
<html>
Password validation
