Metropolitan State University

ICS 325

Building Services on the Internet

 

Lab 8

Client Side Verification using JavaScript

(Linux Redhat 7.1)

 

1.         Verification of a Phone Number.

§         Log onto "redhat.ics.metrostate.edu" using your class account, then do the following:

$ cd

$ cd public_html

$ mkdir lab8

$ cd lab8

§         Edit an HTML document called "phoneCheck.html" using pico with the following lines:

 

<html>

<head>

<title>JavaScript Phone Check</title>

<script type=“text/javascript”

      function checkNumber() {

         var goodPhone=true;

         var goodChars="0123456789-() ";

         var goodNums ="0123456789";

         var phNum = document.myForm.phone.value;

         var phNumFormat = "";

 

         var i = 0;

         while ( i < phNum.length && goodPhone )   {

            var myChar = phNum.charAt(i);

            if (goodNums.indexOf(myChar) != -1)

               phNumFormat = phNumFormat + phNum.charAt(i);

            if (goodChars.indexOf(myChar) == -1)

               alert("An invalid character has been found in your “

+ phone Number: " + myChar);

               goodPhone = false ;

            }

            i++;

         }

         if(phNumFormat.length != 10){

            alert("There is an incorrect number of numbers “ +

“in this phone number, please re-enter");

            goodPhone = false ;

         }

         if(goodPhone){

            var area = phNumFormat.substring(0,3);

            var f3 = phNumFormat.substring(3,6);

            var l4 = phNumFormat.substring(6,10);

            alert("("+area+") "+f3+"-"+l4+ " is a valid number");

         }

         return goodPhone;   

      }

  </script>

</head>

<body>

<form action="" method="post" name="myForm" onsubmit=

"return checkNumber();">

      <input type="text" name="phone">

     <input type="submit" value="Check Number" name="submit">

</form>

</body>

</html>

 

 

§         Invoke IE 5 on your machine, and check your html file with the following address:

http://redhat.ics.metrostate.edu/~su04325??/lab8/phoneCheck.html

 

 

 

 

2.         Verification of a Social Security Number.

§         Log onto "redhat.ics.metrostate.edu" using your class account, then do the following:

$ cd

$ cd public_html

$ cd lab8

§         Edit an HTML document called "ssnCheck.html" using pico with the following lines:

 

<html>

<head>

<title> vstring.html </title>

  <!-- Verifying a social security number  -->

</head>

<script type=“text/javascript”

function checkSSN() {

var goodSSN=true;

  var goodChars="0123456789-";

  var SSN = document.SSNform.inSSN.value;

 

  if ( SSN.length != 11 ) {

      document.SSNform.inSSN.value="";

      alert("This is an invalid SSN please re-enter");

      goodSSN=false;

      return;

  }

  else  {

      for (var i = 0 ; i < 11 ; i ++) {

         var myChar = SSN.charAt(i);

         if (goodChars.indexOf(myChar) == -1)   {

            alert("An invalid character has been found in your SSN: "

+ myChar);

            goodSSN = false ;

         }

      }

      if (goodSSN)   {

         var j = SSN.indexOf("-", 0);

         if ( j < 1 ) {

            alert("A '-' has not been found in your SSN!");

           goodSSN=false;

            return;

         }

         else  {

            var set1=SSN.substring(0,j);

            if (set1.length != 3){

               alert("The first set of number must be 3");

               goodSSN=false;

            }

            else  {

               var j2 = SSN.indexOf("-", j+1);

               var set2=SSN.substring(j+1,j2);

               if (set2.length != 2){

                  alert("The second set of number must be 2");

                  goodSSN=false;

               }

               else  {

                  var set3=SSN.substring(j2+1,SSN.length);

                  if (set3.length != 4){

                     alert("The last set of number must be 4");

                     goodSSN=false;

                  }

                  else 

                     document.writeln("<h2>Your SSN is valid!</h2>");

               }   

            }

         }

      }

  }

}

</script>

<body>

<form name="SSNform" method="post" action="">

      Enter your Social Security Number:

      <input type="text" size="30" name="inSSN" id="inSSN">

      <input type="button" value="Verify" onClick="checkSSN()">

  </form>

</body>

</html>

 

§         Invoke IE 5 on your machine, and check your html file with the following address:

http://redhat.ics.metrostate.edu/~su04325??/lab8/ssnCheck.html