SCRIPT JUNKIE
by Reaz Hoque
Web Techniques,  May 1997

Web Techniques grants permission to use these listings (and code)  for private or
commercial use provided that credit to Web Techniques and the author is
maintained within the comments of the source. For questions, contact
editors@web-techniques.com.       
     
There are 3 listings from the magazine in this file:
     
 
LISTING ONE


<HTML>
<HEAD>
<TITLE>Form Validation</TITLE>
<SCRIPT LANGUAGE="JavaScript1.2">

// --------------------------
// Created By Reaz Hoque
// (c) Reaz Hoque, 1997
// email: r@rhoque.com
// web: http://rhoque.com/book
// Note: please keep this 
// information when using
// --------------------------

// Accepts a-z,A-Z, and space
function fieldA(e) { 
     var keyChar = String.fromCharCode(e.which); 
     if ((keyChar >= "a" && keyChar <= "z") ||
         (keyChar >= "A" && keyChar <= "Z") ||
         keyChar== " ")

         return true;
     else
         return false; 
}

//Accepts 0-9
function fieldB(e) { 
     var keyChar = String.fromCharCode(e.which); 
     if (keyChar >= 0  && keyChar <=9)
        
         return true;
     else
         return false; 
}

//Accepts a-z,A-Z,0-9,"^", "_","@","."
function fieldC(e) { 
     var keyChar = String.fromCharCode(e.which); 
     if ((keyChar >= "a" && keyChar <= "z") ||
         (keyChar >= "A" && keyChar <= "Z") ||
         (keyChar >= "0" && keyChar <="9")  ||
          keyChar == "^" || keyChar == "_"  || 
          keyChar == "@" || keyChar == "."  )

        return true;
     else
         return false; 
}

function fieldD(e) { 
var input_str4=document.forms[0].text4.value;
var input_len4=input_str4.length;
var keyChar = String.fromCharCode(e.which); 

     if (!((keyChar >= 0) && (keyChar <=9)) || (input_len4>4))
          return false; 
}


function empty(form){
var input_str=document.forms[0].user_name.value;
var input_len1=input_str.length;

var input_str2=document.forms[0].text2.value;
var input_len2=input_str2.length;

var input_str3=document.forms[0].text3.value;
var input_len3=input_str3.length;

var input_str4=document.forms[0].text4.value;
var input_len4=input_str4.length;

        if(input_len1 == 0){
                alert("Please enter your name!");
                    document.forms[0].user_name.focus();
                return true;
                }

        if(input_len2 == 0){
                alert("Please enter your age!");
                    document.forms[0].text2.focus();
                return true;
                }

         if(input_len3 == 0 || input_str3.indexOf ('.', 0) == -1 || 
input_str3.indexOf ('@', 0) == -1){
                alert("Please enter your valid email!");
                    document.forms[0].text3.focus();
                    document.forms[0].text3.select();
                return true;
                }

         if(input_len4 < 4){
                alert("Please enter your 5 digit zip code!");
                    document.forms[0].text4.focus();
                    document.forms[0].text4.select();
                return true;
                }

        return false;
}

function submit_this(form){

if(!empty(form)){
        
                document.forms[0].action="http://www.yourdomain.com/cgi-bin/mail.pl";
                document.forms[0].submit();
        }
}
</SCRIPT>
</HEAD>
LISTING ONE continued...




<BODY BGCOLOR="ffffff" TEXT="000000" >
<center>

<H2>Validating Inputs in JavaScript 1.2</H2>
<hr noshade width=65%>

<form name="myForm" METHOD="POST" ENCTYPE="text/plain" 
onSubmit='submit_this(this.form);'>

<b>Your Name (non numeric input):<BR></b>
<input type="text" name="user_name" SIZE="50" MAXLENGTH="50"><BR>

<b>Your Age (non alphabetic input):</b><BR>
<input type="text" name="text2" SIZE="50" MAXLENGTH="50"><BR> 

<b>Your E-mail Address:</b><BR>
<input type="text" name="text3" SIZE="50" MAXLENGTH="50"><BR> 

<b>Your 5 Digit Zip Code:</b><BR>
<input type="text" name="text4" SIZE="50" MAXLENGTH="50"><BR> 

<input type="submit" VALUE="Send Form">
<input type="reset" Value="Reset Form">

</form>
<script>
document.forms[0].elements[0].onkeydown = fieldA;
document.forms[0].elements[1].onkeydown = fieldB;
document.forms[0].elements[2].onkeydown = fieldC;
document.forms[0].elements[3].onkeydown = fieldD;
</script>
</BODY>
</HTML>