Using functions
I've got a problemswhere the answer has eluded me. everytime I deliberately type a user name with less than 6 characters, or intentionally type 2 different passwords, instead of getting a message saying that there was an error of some sort, and the focus going back to the form contols, the page just moves on.???
Here is the following code:
<?xml versionh="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>Re-usable functions</title>
<script type="text/JavaScript">
function validateMinimumLength (control, length, errormessage) {
var error="";
document.getElementById(control.id).nextSibling.in nerHTML="";
if (control.value.length < length) {
error = errormessage;
document.getElementById(control.id).nextSibling.in nerHTML=errormessage;
document.getElementById(control.id).focus();
}
return error;
}
function validateConfirmPassword (password1, password2, errormessage) {
var error="";
document.getElementById(password1.id).nextSibling. innerHTML="";
if (password1.value != password2.value) {
error = errormessage;
document.getElementById(password1.id).nextSibling. innerHTML=errormessage;
document.getElementById(password1.id).focus();
}
return error;
}
function validate(form) {
var returnValue = "";
returnValue += validateConfirmPassword(form.txtPassword, form.txtPassword2,
'Your passwords did not match');
returnValue += validateMinimumLength(form.txtPassword, 6,
'Your password must be at least 6 characters long');
returnVlaue += validateMinimumLength(form.txtUserName, 6,
'Your username must be at least 6 characters long');
if (returnValue != "") {
return false;
}
return true;
}
</script>
</head>
<body>
<form name="frmRegister" method="post" action="register.aspx"
onsubmit="validate(this);">
<div>
<label for="txtUserName">Username:</label>
<input type="text" id="txtUserName" size="12"><span class="message"></span>
</div>
<div>
<label for="txtPassword">Password:</label>
<input type="password" id="txtPassword" size="12"><span class="message"></span>
</div>
<div>
<label for="txtPassword2">Confirm password:</label>
<input type="password" id="txtPassword2" size="12"><span class"message"></span>
</div>
<div>
<input type="submit" value="Log in">
</div>
</form>
</body>
</html>
Any help will again be grateful. Thanks.
|