Javascript validation

label Programming
account_circle Unassigned
schedule 3 Days
account_balance_wallet $5

<!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>Contact</title>
<link href="styles.css" rel="stylesheet"/>
<script src="trim.js" type="text/javascript"></script>
<script src="javascript.js" type="text/javascript" > </script>
</head>

<body>
 <div id="wrapper">
  <div id="navigation">
   <ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="contact.html">Contact</a></li>
  <li><a href="about.html">About</a></li>
  <li><a href="roster.html">Roster</a></li>
  <li><a href="schedule.html">Schedule</a></li>
  </ul>
  </div>
  <h1>Sign up Form</h1>
  <p>If you wish to play on our team, Kenton Winn will get back to you.</p>
  <div id="content-wrapper">
  <form name="yourChar" id="yourChar" action="http://faculty.edumedia.ca/jarvisa/forms/valid.php" method="get">
   
     <div class="box">
  <label for="charName">Name:</label>
  <input type="text" id="charName" class="charField txt" name="charName" />
  <div class="fieldInfo">
     Please enter your name.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="city">City:</label>
  <input type="text" id="city" class="city txt" name="city" />
  <div class="fieldInfo">
     Please enter your City.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="email">E-mail:</label>
  <input type="text" id="email" class="email txt" name="email" />
  <div class="fieldInfo">
     Please enter your email.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="number">Phone Number:</label>
  <input type="text" id="number" class="number txt" name="number" />
  <div class="fieldInfo">
     Please enter your phone number
  </div>
  </div>
  <div class="formbox">
     <input type="submit" id="btnSubmit" name="btnSubmit" class="button" value="Submit" />
  </div>   
  </form>
  </div>
  </div>   
</body>
</html>
window.onload = awesome;


//declare globals
var theForm;

function awesome(){



  //onclick for submit button
  document.querySelector("#btnSubmit").onclick = processForm;
 
  //onblur functions for text fields
  document.querySelector("#charName").onblur = checkName;
  document.querySelector("#email").onblur = checkEmail;
  document.querySelector("#number").onblur = checkNumber;
 
  //get the whole form
  theForm = document.querySelector("#yourChar");

}
//function that processes the information in the form
function processForm(){

  //set an error message variable
  var msg = "";

  //validate the name!
  //call the function that handles name validation (it will return true if there
  //was an error)
  msg = checkName();
 
  //validate the email!
  msg = checkEmail();
 
  //validate the number;
  msg = checkNumber();
 


 
 
  var beer = true;
  var glass = new Array();
  glass.push(checkName());
  glass.push(checkEmail());
  for (var i = 0; i < glass.length; i++){
  if(glass[i] == false){
  beer=false;
  }   
   
  }
  if ( ! beer ){
  return false;
  }else{
  return true;
  }

}



//check the name field
function checkName(){
  //rules:   cannot be less than 2 characters or more than 50
  //       cannot have numbers
  var namefield = document.querySelector("#charName");
 
  var msg="";
  var spaces=false;
  var numbers=false;
  var counter=0;
  var words=false;
  var beer=true;
 
 
  var name = theForm.charName.value; //loop through the value of the entire field, looking for numbers and spaces 11    //trim removes leading and trailing spaces     name = trim(name);
 
  //loop through the value of the entire field, looking for numbers and spaces
  //also count the number of characters between spaces
  for(var q=0;q<namefield.value.length;q++){
  //if a space is found (after trimming) set the spaces variable to true
  if(namefield.value.substring(q,q+1)==" "){
  spaces = true;
  //since we've found a space, there should be more than one word (provided you have used the trim function)
  if(counter<2){
  //if the counter is less than 2, then the word that came before the space has less than 2 characters in it
  words = true;   
  }
  //reset the counter (-1 so when we count up below it starts again at 0)
  counter = -1;
  }else if(isNaN(namefield.value.substring(q,q+1))==false){
  //isNaN returns false if you find a number
  numbers = true;
  }
  //for each character, count up by 1
  counter += 1;   
  }
  //after the loop, check the values of the variables
  if(numbers == true){
  msg+= "No Numbers!";   
  }
  if(spaces == false){
  msg+= "More than one word please!\n";   
  }
  if(words == true){
  msg += "Words must have more than one character!\n";
  }
  //|| (double pipeline) is 'or'
  if(name.length  < 2 || name.length > 50){
  msg += "Name must be between 2 and 50 characters. ";
   
  }

 
  //check for an error message
  if(msg != ""){
  theForm.charName.parentNode.childNodes[5].innerHTML = '<span class="error">' + msg + '</span>';
  //have the form return true for the play button
  return false; //fail
  }else{
  theForm.charName.parentNode.childNodes[5].innerHTML = '<span class="correct">A good, strong name.</span>';
  return beer;
  }
 
}

//check the email
function checkEmail(){
  //rules:   must have @ symbol, must have . after @
  //       only one @ symbol, at least one .
  //       the last . must be at least two characters from the end
  //       the @ cannot be the first character
  var email = theForm.email.value;
  //get the positions of various things in the email
  var firstAt = email.indexOf("@");
  var lastAt = email.lastIndexOf("@");
  var firstDot = email.indexOf(".");
  var lastDot = email.lastIndexOf(".");
  var wrongEmail = true;
 
 
  //check for @ symbol (can't be first, must be only one)
  if(firstAt == 0 || firstAt == -1 || firstAt != lastAt){
  //firstAt == 0: @ is the first character
  //firstAt == -1: no @ symbol found
  //firstAt != lastAt: more than one @
  wrongEmail = false; //fail
  }
 
  //check for . symbol (must be at least 1, 1 must come after last @,
  //must be at least 2 characters after last .
  if(firstDot == -1 || lastDot < lastAt || (lastDot >= email.length-2) ){
  //firstDot == -1: no . found
  //lastDot < lastAt: no . after @
  //lastDot >= email.length-2: less than 2 characters after last dot
  wrongEmail = false; //fail
  }
 
  //check for email error found
  if(! wrongEmail){
  theForm.email.parentNode.childNodes[5].innerHTML = '<span class="error">Please enter a valid email address.</span>';
  return wrongEmail;
  }else{
  theForm.email.parentNode.childNodes[5].innerHTML = '<span class="correct">What a lovely email.</span>';   
  return wrongEmail;   
  }

}
 function checkNumber(){
    var subjectString = theForm.number.value;
   var regexObj = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
   if (regexObj.test(subjectString)) {
     var formattedPhoneNumber = subjectString.replace(regexObj, "($1) $2-$3");
     theForm.number.value = formattedPhoneNumber;
     theForm.number.parentNode.childNodes[5].innerHTML = '<span class="correct">Thank you for the phone number.</span>';
   } else {
     theForm.number.value = '';
     theForm.number.parentNode.childNodes[5].innerHTML = '<span class="error">Incorrect phone number.</span>';
   }
}
// Invalid phone number

 // JavaScript Document

function trim( theString ){
   //clear the leading spaces
   while( theString.length> 0 && (theString.substr(0, 1) == " " || theString.substr(0,1) == "\t" || theString.substr(0,1) == "\r" || theString.substr(0,1) == "\n") ){
     theString = theString.substr(1);
     //the string is now equal to itself starting from the second character to the end.
   }
   
   //clear the trailing spaces
   while( theString.length> 0 && (theString.substr(theString.length-1, 1) == " " || theString.substr(theString.length-1,1) == "\t" || theString.substr(theString.length-1,1) == "\r" || theString.substr(theString.length-1,1) == "\n") ){
     theString = theString.substr(0, theString.length-1);
     //the string is now equal to itself starting from the first character to one character before the end.
   }
   
   //now we can send back the cleaned string
   return theString;
}
 

Oct 17th, 2017

<!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>Contact</title>
  <link href="styles.css" rel="stylesheet"/>
  <script src="trim.js" type="text/javascript"></script>
  <script src="javascript.js" type="text/javascript" > </script>

  <script type="text/javascript">
  var theForm;
  function awesome(){   
  //onclick for submit button
  document.querySelector("#btnSubmit").onclick = processForm;
  //onblur functions for text fields
  document.querySelector("#charName").onblur = checkName;
  document.querySelector("#email").onblur = checkEmail;
  document.querySelector("#number").onblur = checkNumber;
  //get the whole form
  theForm = document.querySelector("#yourForm");
     
  }
  function processForm(){

  //set an error message variable
  var msg = "";
  //validate the name!
  //call the function that handles name validation (it will return true if there
  //was an error)
  msg = checkName();
  //validate the email!
  msg = checkEmail();
  //validate the number;
  msg = checkNumber();
     
  var beer = true;
  var glass = new Array();
  glass.push(checkName());
  glass.push(checkEmail());
     glass.push(checkNumber());
  for (var i = 0; i < glass.length; i++){
  if(glass[i] == false){
  beer=false;
  }   
  }
  if ( ! beer ){
  return false;
  }else{
  return true;
  }
     alert(beer);
  }


  function checkName(){
  //rules:  cannot be less than 2 characters or more than 50
  //  cannot have numbers
 theForm = document.querySelector("#yourForm");

  var namefield = document.querySelector("#charName");
  var msg="";
  var spaces=false;
  var numbers="false";
  var counter=0;
  var words=false;
  var beer=true;
  var name = theForm.charName.value; //loop through the value of the entire field, looking for
  name = trim(name);
 
  //loop through the value of the entire field, looking for numbers and spaces
  //also count the number of characters between spaces
  for(var q=0;q<name.length;q++){
  //if a space is found (after trimming) set the spaces variable to true
  if(namefield.value.substring(q,q+1)==" "){
  spaces = true;
  //since we've found a space, there should be more than one word (provided you have used the
  // trim function)
  if(counter<2){
  //if the counter is less than 2, then the word that came before the space has less than 2
  //characters in it
  words = true;   
  }
  //reset the counter (-1 so when we count up below it starts again at 0)
  counter = -1;
  }
  else if(isNaN(namefield.value.substring(q,q+1))==false){
  //isNaN returns false if you find a number
  numbers = true;
  }
  //for each character, count up by 1
  counter += 1;   
  }
  //after the loop, check the values of the variables
  if(numbers == true){
  msg+= "No Numbers!";   
  }
  if(spaces == false){
  msg+= "More than one word please!\n";   
  }
  if(words == true){
  msg += "Words must have more than one character!\n";
  }
  //|| (double pipeline) is 'or'
  if(name.length  < 2 || name.length > 50){
  msg += "Name must be between 2 and 50 characters. ";
   
  }

 
  //check for an error message
  if(msg != ""){
  theForm.charName.parentNode.childNodes[5].innerHTML = '<span class="error">' + msg +
  '</span>';
  //have the form return true for the play button
  return false; //fail
  }else{
  theForm.charName.parentNode.childNodes[5].innerHTML = '<span class="correct">A good,strong name.</span>';
  return beer;
  }
   
 
  }
   
  function trim( theString ){
  //clear the leading spaces
  while( theString.length> 0 && (theString.substr(0, 1) == " " || theString.substr(0,1) == "\t" ||
  theString.substr(0,1) == "\r" || theString.substr(0,1) == "\n") ){
  theString = theString.substr(1);
  //the string is now equal to itself starting from the second character to the end.
  }
   
  //clear the trailing spaces
  while( theString.length> 0 && (theString.substr(theString.length-1, 1) == " " || theString.substr
  (theString.length-1,1) == "\t" || theString.substr(theString.length-1,1) == "\r" || theString.substr
  (theString.length-1,1) == "\n") ){
  theString = theString.substr(0, theString.length-1);
  //the string is now equal to itself starting from the first character to one character before the
  //end.
  }
   
  //now we can send back the cleaned string
  return theString;
  }
  function checkNumber(){
    theForm = document.querySelector("#yourForm");
  var subjectString = theForm.number.value;
  var regexObj = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
  if (regexObj.test(subjectString)) {
  var formattedPhoneNumber = subjectString.replace(regexObj, "($1) $2-$3");
  theForm.number.value = formattedPhoneNumber;
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="correct">Thank you for the phone number</span>';
  } else {
  theForm.number.value = '';
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="error">Incorrect phone number.</span>';
  }
  }
   
   
  function checkEmail(){
 theForm = document.querySelector("#yourForm");
  //rules:  must have @ symbol, must have . after @
  //  only one @ symbol, at least one .
  //  the last . must be at least two characters from the end
  //  the @ cannot be the first character
  var email = theForm.email.value;
  //get the positions of various things in the email
  var firstAt = email.indexOf("@");
  var lastAt = email.lastIndexOf("@");
  var firstDot = email.indexOf(".");
  var lastDot = email.lastIndexOf(".");
  var wrongEmail = true;
 
 
  //check for @ symbol (can't be first, must be only one)
  if(firstAt == 0 || firstAt == -1 || firstAt != lastAt){
  //firstAt == 0: @ is the first character
  //firstAt == -1: no @ symbol found
  //firstAt != lastAt: more than one @
  wrongEmail = false; //fail
  }
 
  //check for . symbol (must be at least 1, 1 must come after last @,
  //must be at least 2 characters after last .
  if(firstDot == -1 || lastDot < lastAt || (lastDot >= email.length-2) ){
  //firstDot == -1: no . found
  //lastDot < lastAt: no . after @
  //lastDot >= email.length-2: less than 2 characters after last dot
  wrongEmail = false; //fail
  }
 
  //check for email error found
  if(! wrongEmail){
  theForm.email.parentNode.childNodes[5].innerHTML = '<span class="error">Please enter a valid email address.</span>';
  return wrongEmail;
  }else{
  theForm.email.parentNode.childNodes[5].innerHTML = '<span class="correct">What a lovely email.</span>';   
  return wrongEmail;   
  }
}
   
  function checkNumber(){
 theForm = document.querySelector("#yourForm");
  var subjectString = theForm.number.value;
        var wrongNumber = true;
  var regexObj = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
  if (regexObj.test(subjectString)) {
  var formattedPhoneNumber = subjectString.replace(regexObj, "($1) $2-$3");
  theForm.number.value = formattedPhoneNumber;
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="correct">Thank you for the phone number.</span>';
       wrongNumber = true;
  } else {
  theForm.number.value = '';
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="error">Incorrect phone number.</span>';
       wrongNumber=false;
  }
     return wrongNumber;
  }
  </script>
  </head>

  <body onsubmit="return processForm();">
  <div id="wrapper">
  <div id="navigation">
  <ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="contact.html">Contact</a></li>
  <li><a href="about.html">About</a></li>
  <li><a href="roster.html">Roster</a></li>
  <li><a href="schedule.html">Schedule</a></li>
  </ul>
  </div>
  <h1>Sign up Form</h1>
  <p>If you wish to play on our team, Kenton Winn will get back to you.</p>
  <div id="content-wrapper">
  <form name="yourForm" id="yourForm"
  action="http://faculty.edumedia.ca/jarvisa/forms/valid.php" method="get" onsubmit="return processForm();">

  <div class="box">
  <label for="charName">Name:</label>
  <input type="text" id="charName" class="charField txt" name="charName" onblur="checkName()" />
  <div class="fieldInfo">
  Please enter your name.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="city">City:</label>
  <input type="text" id="city" class="city txt" name="city" onblur="checkName()" />
  <div class="fieldInfo">
  Please enter your City.
  </div>
  </div>
  <br />
  <div class="box2" >
  <label for="email">E-mail:</label>
  <input type="text" id="email" class="email" name="email" onblur="checkEmail()" />
  <div class="fieldInfo">
  Please enter your email.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="number">Phone Number:</label>
  <input type="text" id="number" class="number" name="number" onblur="checkNumber()"/>
  <div class="fieldInfo">
  Please enter your phone number
  </div>
  </div>
  <div class="formbox">
  <input type="submit" id="btnSubmit" name="btnSubmit" class="button" value="Submit" />
  </div>   
  </form>
  </div>
  </div>   
  </body>
</html>

Jun 14th, 2013

I am not sure what you did but none of my fields validate now.

Jun 14th, 2013

Hi this is the working file for you. Once again.

 


 

<!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>Contact</title>
  <link href="styles.css" rel="stylesheet"/>
 

  <script type="text/javascript">
  var theForm;
  function awesome(){ 
  //onclick for submit button
  document.querySelector("#btnSubmit").onclick = processForm;
  //onblur functions for text fields
  document.querySelector("#charName").onblur = checkName;
  document.querySelector("#email").onblur = checkEmail;
  document.querySelector("#number").onblur = checkNumber;
  //get the whole form
  theForm = document.querySelector("#yourForm");
 
  }
  function processForm(){

  //set an error message variable
  var msg = "";
  //validate the name!
  //call the function that handles name validation (it will return true if there
  //was an error)
  msg = checkName();
  //validate the email!
  msg = checkEmail();
  //validate the number;
  msg = checkNumber();
 
  var beer = true;
  var glass = new Array();
  glass.push(checkName());
  glass.push(checkEmail());
  glass.push(checkNumber());
  for (var i = 0; i < glass.length; i++){
  if(glass[i] == false){
  beer=false;
  } 
  }
  if ( ! beer ){
  return false;
  }else{
  return true;
  }
  alert(beer);
  }


  function checkName(){
  //rules:  cannot be less than 2 characters or more than 50
  //  cannot have numbers
 theForm = document.querySelector("#yourForm");

  var namefield = document.querySelector("#charName");
  var msg="";
  var spaces=false;
  var numbers="false";
  var counter=0;
  var words=false;
  var beer=true;
  var name = theForm.charName.value; //loop through the value of the entire field, looking for
  name = trim(name);
 
  //loop through the value of the entire field, looking for numbers and spaces
  //also count the number of characters between spaces
  for(var q=0;q<name.length;q++){
  //if a space is found (after trimming) set the spaces variable to true
  if(namefield.value.substring(q,q+1)==" "){
  spaces = true;
  //since we've found a space, there should be more than one word (provided you have used the
  // trim function)
  if(counter<2){
  //if the counter is less than 2, then the word that came before the space has less than 2
  //characters in it
  words = true; 
  }
  //reset the counter (-1 so when we count up below it starts again at 0)
  counter = -1;
  }
  else if(isNaN(namefield.value.substring(q,q+1))==false){
  //isNaN returns false if you find a number
  numbers = true;
  }
  //for each character, count up by 1
  counter += 1; 
  }
  //after the loop, check the values of the variables
  if(numbers == true){
  msg+= "No Numbers!"; 
  }
  if(spaces == false){
  msg+= "More than one word please!\n"; 
  }
  if(words == true){
  msg += "Words must have more than one character!\n";
  }
  //|| (double pipeline) is 'or'
  if(name.length  < 2 || name.length > 50){
  msg += "Name must be between 2 and 50 characters. ";
 
  }

 
  //check for an error message
  if(msg != ""){
  theForm.charName.parentNode.childNodes[5].innerHTML = '<span class="correct">' + msg +
  '</span>';
  //have the form return true for the play button
  return false; //fail
  }else{
  theForm.charName.parentNode.childNodes[5].innerHTML = '<span class="correct">A good,strong name.</span>';
  return beer;
  }
 
 
  }
 
  function trim( theString ){
  //clear the leading spaces
  while( theString.length> 0 && (theString.substr(0, 1) == " " || theString.substr(0,1) == "\t" ||
  theString.substr(0,1) == "\r" || theString.substr(0,1) == "\n") ){
  theString = theString.substr(1);
  //the string is now equal to itself starting from the second character to the end.
  }
 
  //clear the trailing spaces
  while( theString.length> 0 && (theString.substr(theString.length-1, 1) == " " || theString.substr
  (theString.length-1,1) == "\t" || theString.substr(theString.length-1,1) == "\r" || theString.substr
  (theString.length-1,1) == "\n") ){
  theString = theString.substr(0, theString.length-1);
  //the string is now equal to itself starting from the first character to one character before the
  //end.
  }
 
  //now we can send back the cleaned string
  return theString;
  }
  function checkNumber(){
  theForm = document.querySelector("#yourForm");
  var subjectString = theForm.number.value;
  var regexObj = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
  if (regexObj.test(subjectString)) {
  var formattedPhoneNumber = subjectString.replace(regexObj, "($1) $2-$3");
  theForm.number.value = formattedPhoneNumber;
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="correct">Thank you for the phone number</span>';
  } else {
  theForm.number.value = '';
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="error">Incorrect phone number.</span>';
  }
  }
 
 
  function checkEmail(){
 theForm = document.querySelector("#yourForm");
  //rules:  must have @ symbol, must have . after @
  //  only one @ symbol, at least one .
  //  the last . must be at least two characters from the end
  //  the @ cannot be the first character
  var email = theForm.email.value;
  //get the positions of various things in the email
  var firstAt = email.indexOf("@");
  var lastAt = email.lastIndexOf("@");
  var firstDot = email.indexOf(".");
  var lastDot = email.lastIndexOf(".");
  var wrongEmail = true;
 
 
  //check for @ symbol (can't be first, must be only one)
  if(firstAt == 0 || firstAt == -1 || firstAt != lastAt){
  //firstAt == 0: @ is the first character
  //firstAt == -1: no @ symbol found
  //firstAt != lastAt: more than one @
  wrongEmail = false; //fail
  }
 
  //check for . symbol (must be at least 1, 1 must come after last @,
  //must be at least 2 characters after last .
  if(firstDot == -1 || lastDot < lastAt || (lastDot >= email.length-2) ){
  //firstDot == -1: no . found
  //lastDot < lastAt: no . after @
  //lastDot >= email.length-2: less than 2 characters after last dot
  wrongEmail = false; //fail
  }
 
  //check for email error found
  if(! wrongEmail){
  theForm.email.parentNode.childNodes[5].innerHTML = '<span class="error">Please enter a valid email address.</span>';
  return wrongEmail;
  }else{
  theForm.email.parentNode.childNodes[5].innerHTML = '<span class="correct">What a lovely email.</span>'; 
  return wrongEmail; 
  }
}
 
  function checkNumber(){
 theForm = document.querySelector("#yourForm");
  var subjectString = theForm.number.value;
  var wrongNumber = true;
  var regexObj = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
  if (regexObj.test(subjectString)) {
  var formattedPhoneNumber = subjectString.replace(regexObj, "($1) $2-$3");
  theForm.number.value = formattedPhoneNumber;
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="correct">Thank you for the phone number.</span>';
  wrongNumber = true;
  } else {
  theForm.number.value = '';
  theForm.number.parentNode.childNodes[5].innerHTML = '<span class="error">Incorrect phone number.</span>';
  wrongNumber=false;
  }
  return wrongNumber;
  }
  </script>
  </head>

  <body onsubmit="return processForm();">
  <div id="wrapper">
  <div id="navigation">
  <ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="contact.html">Contact</a></li>
  <li><a href="about.html">About</a></li>
  <li><a href="roster.html">Roster</a></li>
  <li><a href="schedule.html">Schedule</a></li>
  </ul>
  </div>
  <h1>Sign up Form</h1>
  <p>If you wish to play on our team, Kenton Winn will get back to you.</p>
  <div id="content-wrapper">
  <form name="yourForm" id="yourForm"
  action="http://faculty.edumedia.ca/jarvisa/forms/valid.php" method="get" onsubmit="return processForm();">

  <div class="box">
  <label for="charName">Name:</label>
  <input type="text" id="charName" class="charField txt" name="charName" onblur="checkName()" />
  <div class="fieldInfo">
  Please enter your name.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="city">City:</label>
  <input type="text" id="city" class="city txt" name="city" onblur="checkName()" />
  <div class="fieldInfo">
  Please enter your City.
  </div>
  </div>
  <br />
  <div class="box2" >
  <label for="email">E-mail:</label>
  <input type="text" id="email" class="email" name="email" onblur="checkEmail()" />
  <div class="fieldInfo">
  Please enter your email.
  </div>
  </div>
  <br />
  <div class="box2">
  <label for="number">Phone Number:</label>
  <input type="text" id="number" class="number" name="number" onblur="checkNumber()"/>
  <div class="fieldInfo">
  Please enter your phone number
  </div>
  </div>
  <div class="formbox">
  <input type="submit" id="btnSubmit" name="btnSubmit" class="button" value="Submit" />
  </div> 
  </form>
  </div>
  </div> 
  </body>
</html>

Jun 14th, 2013

Studypool's Notebank makes it easy to buy and sell old notes, study guides, reviews, etc.
Click to visit
The Notebank
...
Oct 17th, 2017
...
Oct 17th, 2017
Oct 18th, 2017
check_circle
Mark as Final Answer
check_circle
Unmark as Final Answer
check_circle
Final Answer

Secure Information

Content will be erased after question is completed.

check_circle
Final Answer