I am doing an assignment that takes a registration fored and validates each field to make sure it was filled out and filled out properly. I have found a code that should work to make the validation but when I incorperated it to rthis code it does not work. Everything looks good to me but I guess there is something I am missing but not sure what.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Registration</title>
<!--Create a registration form, similar to what you may encounter when registering for an
online Web site.
Include three sections: Personal Information, Security Information, and Preferences.
In the Personal Information section, add name, e-mail address, and telephone fields.
Include default text in the name and e-mail text boxes, but write some code that
removes the default text from each text box when a user clicks it.
Write code for the telephone field that prevents users from entering any values except for numbers.
In the Security Information section, add password and password confirmation fields. Write code that
ensures that the same value was entered into both fields.
Also add a security challenge question selection list and a security answer text box that the Web site will use to help
identify a user in the event that he or she loses his or her password.
The security challenge selection list should contain questions such as What is your mother's maiden name?,
What is the name of your pet?, and What is your favorite color?.
In the Preferences section, add radio buttons that confirm whether a user wants special offers sent to his
or her e-mail address.
Also, include check boxes with special interests the user may be interested in, such as
entertainment, business, and shopping.
Add submit and reset buttons that call submit() and reset() event handler functions when they are clicked.
The submit() event handler function should ensure that the user has entered values into
each text box, and that the values submitted are not the same as the default text.
The submit() event handler function should also ensure that the user selects a security
challenge question, selects a radio button to confirm whether he or she wants special offers
sent to his or her e-mail address, and selects at least one interest check box. Submit
the form to the FormProcessor.html script (there is a copy in your Cases folder for
Chapter 5). Save the document as Registration.html.
-->
<script language="Javascript">
<!--
function checkform(){
if (document.input.name.value.length < 3){
alert("Please enter a name .")
return false}
if (document.input.password.value.length < 5)<br />
{
alert("Please enter at least 5 characters for your password.")
return false
}
if (document.input.password_confirm.value != document.input.password.value){
window.alert("You did not enter the same password!");
}
if ((document.input.email.value.length < 10) || (document.input.email.value.indexOf('@') == -1) || (document.input.email.value.indexOf('.') == -1)){
alert("Please enter a valid email address like you@domain.com")
return false}
if (document.input.phoneNumber. == false){
alert("You need to read and agree to the terms of service.")
return false}
}
// -->
</script>
</head>
<body>
<h1>Registration Page</h1>
<form name="input" action="" method="Post" onSubmit="return checkform(this.form)">
<h3>Personal Information</h3>
<input type="text" name="name" value="Name" onFocus="if(this.value == 'Name') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'Name';}"/><br />
<input type="text" name="email" value="E-mail Address" onFocus="if(this.value == 'E-mail Address') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'E-mail Address';}"/><br />
<input type="text" name="phoneNumber" value="Phone Number" onFocus="if(this.value == 'Phone Number') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'Phone Number';}"/><br />
<h3>Security Information</h3>
<input type="password" name="password" value="Password" maxlength=10 onFocus="if(this.value == 'Password') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'Password';}"/><br />
<input type="password" name="password_comfirm" value="Password" maxlength=10 onFocus="if(this.value == 'Password') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'Password';}"/><br />
<select><br />
<option>Security Question:</option>
<option>What is your Mother's maiden name?</option><br />
<option>What is your pets name?</option><br />
<option>What is the name of your High School?</option><br />
</select><br />
<input type="text" name="answer" value="Question Answer" onFocus="if(this.value == 'Question Answer') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'Question Answer';}"/><br />
<h3>Preferences</h3>
Yes<input type="radio" name="answer" value="Yes"/>No<input type="radio" name="answer" value="No" />Would you like any special offers sent to your E-mail address?<br />
<h5>Interests</h5>
<input type="checkbox" name="interest" value="Entertainment"/>Entertainment<br />
<input type="checkbox" name="interest" value="Shopping"/>Shopping<br />
<input type="checkbox" name="interest" value="Business"/>Business<br />
<input type="checkbox" name="interest" value="Exercise"/>Exercise<br />
<br />
<p class="red">All the above are required fields.</p>
<input type="submit" value="Submit"/>
<input type="button" value="Reset"/>
</form>
</body>
</html>
The code below is the one I am compairing it to. This one works properly but I can not get it to work with my scenario.
Code:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="Javascript">
<!--
function checkform(){
if (document.signup.username.value.length < 4){
alert("Please enter a name with at least 4 characters.")
return false}
if (document.signup.password.value.length < 5){
alert("Please enter at least 5 characters for your password.")
return false}
if ((document.signup.email.value.length < 9) || (document.signup.email.value.indexOf('@') == -1) || (document.signup.email.value.indexOf('.') == -1)){
alert("Please enter a valid email address like you@domain.com")
return false}
if (document.signup.confirm.checked == false){
alert("You need to read and agree to the terms of service.")
return false}
}
// -->
</script>
</head>
<body>
<form name="signup" action="" method="POST" onSubmit="return checkform(this.form)">
<table>
<tr><td>Enter your name or handle:</td><td><input name="username" type="text" value="" maxlength="15"> - this will appear in your postings.</td></tr>
<tr><td>Your chosen password:</td><td><input name="password" type="text" value="" maxlength="15"> - write this down in a safe place.</td></tr>
<tr><td>Your email address:</td><td><input name="email" type="text" value="" maxlength="30"> - will be kept hidden.</td></tr>
<tr><td colspan=2><p class="red">We will email you your user ID so please make sure your email address is correct!</p></td></tr>
<tr><td>Location:</td><td><br>
<select name="location" size=3>
<OPTION value="1" SELECTED>United States
<OPTION value="2">Canada
<OPTION value="3">United Kingdom
<OPTION value="4">Australia
<OPTION value="5">Japan
<OPTION value="6">Germany
<OPTION value="7">Austria
<OPTION value="8">Argentina
<OPTION value="9">Belgium
<OPTION value="10">Brazil
<OPTION value="2">Canada
<OPTION value="11">Denmark
<OPTION value="12">Finland
<OPTION value="13">France
<OPTION value="6">Germany
<OPTION value="14">Hong Kong
<OPTION value="15">India
<OPTION value="16">Ireland
<OPTION value="17">Israel
<OPTION value="18">Italy
<OPTION value="19">Japan
<OPTION value="20">Mexico
<OPTION value="21">New Zealand
<OPTION value="22">Norway
<OPTION value="23">Singapore
<OPTION value="24">Spain
<OPTION value="25">South Africa
<OPTION value="26">South Korea
<OPTION value="27">Sweden
<OPTION value="28">Switzerland
<OPTION value="29">Taiwan
<OPTION value="30">The Netherlands
<OPTION value="3">United Kingdom
<OPTION value="1">United States
<OPTION value="0">Other country
</select>
</td></tr>
</table>
<p>I confirm that I have read and agree to the <b>terms of service</b>: <input type="checkbox" name="confirm" value="check me">
<p class="red">All the above are required fields.</p>
<p><input type="submit" value="Click to Validate"> - your login details will be sent by email</p>
</form>
</body>
</html>