How do i validate this?

Discussion in 'JavaScript' started by demondestiny, Nov 9, 2010.

  1. #1
    Hey i need help with validating. What have i done wrong i can't seem to get my work to validate.

    
    <!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>
      <title>Untitled Document</title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <style type="text/css">
      	
    	fieldset {
    		font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
    		color: #666666;
    		background: #EFEFEF;
    		padding: 2px;
    		border: solid 1px #D3D3D3;
    		width: 500px;
    	}
    	
    	legend {
    		color: #666666;
    		font-weight: bold;
    		font-variant: small-caps;
    		padding: 2px 6px;
    		margin-bottom: 8px;
    	}
    	
    	label {
    		font-weight: bold;
    		line-height: normal;
    		text-align: right;
    		margin-right: 10px;
    		position: relative;
    		display: block;
    		float: left;
    		width: 125px;
    	}
    	
    	label.fieldLabel {
    		display: inline;
    		float: none;
    	}
    	
    	label.formInputText {
    		font-size: .8em;
    		color: #666666;
    		background-color: #FFEEEE;
    		padding: 2px;
    		border: solid 1px #FF6666;
    		margin-right: 5px;
    		margin-bottom: 5px;
    		height: 15px;
    	}
    	
    	input.formInputText:hover {
    		background-color: #CCFFFF;
    		border: solid 1px #006600;
    		color: #000000;
    	}
    	
    	input.formInputText:focus {
    		color: #000000;
    		background-color: #FFFFFF;
    		border: solid 1px #006600;
    	}
    	
    	select.formSelect {
    		font-size: .8em;
    		color: #666666;
    		background-color: #FFEEEE;
    		padding: 2px;
    		border: solid 1px #FF6666;
    		margin-right: 5px;
    		margin-bottom: 5px;
    		cursor: pointer;
    	}
    	
    	select.formSelect:hover {
    		color: #333333;
    		background-color: #CCFFFF;
    		border: solid 1px #006600;
    	}
    	
    	select.formSelect:focus {
    		color: #333333;
    		background-color: #FFFFFF;
    		border: solid 1px #006600;
    	}
    	
    	input.formInputButton {
    		font-size: 1.2em;
    		vertical-align: middle;
    		font-weight: bolder;
    		text-align: center;
    		color: #330000;
    		background-color: #FF9999;
    		padding: 1px;
    		border: solid 1px #FF6666;
    		cursor: pointer;
    		float: right;
    	}	
    	
      </style>
    
    <script type="text/javascript">
     if (firstName == null)
        {
        alert("Please enter your first name");
        }
        else if (firstName == "")
        {
        alert("Nothing has been entered");
        }
        else if (lastName == null)
        {
        alert("Please enter your last name");
        }
        else if (lastName == "")
        {
        alert("Nothing has been entered");
        }
        else if (age == null)
        {
        alert("Please enter your age");
        }
        else if (age == "")
        {
        alert("Nothing has been entered");
        }
        else if (age != parseInt(age))
        {
        alert("Age must be numeric");
        }
        else if (emailAddress == null)
        {
        alert("Please enter your email address");
        }
        else if (emailAddress == "")
        {
        alert("Nothing has been entered");
        }
        else if (password == null)
        {
        alert("Please enter your password");
        }
        else if (password == "")
        {
        alert("Nothing has been entered");
        }
    </script>
    
     </head>
     <body>
    
      <form id="myForm" method="get" onsubmit="return validate_form(this)" action="http://www.itmm-online.com/elearning/website-administration/resources/validateform.php">
       <fieldset>
        <legend>Personal Information</legend>
        <label for="firstName">First Name</label>
        <input class="formInputText" type="text" name="firstName" id="firstName" value="" size="12" maxlength="16" tabindex="1" />
        <br />
        <label for="lastName">Last Name</label>
        <input class="formInputText" type="text" name="lastName" id="lastName" value="" size="12" maxlength="16" tabindex="3" />
         <br />
        <label for="age">Age</label>
        <input class="formInputText" type="text" name="age" id="age" value="" size="3" maxlength="3" tabindex="4" />
        <br />
        <label for="emailAddress">Email Address</label>
        <input class="formInputText" type="text" name="emailAddress" id="emailAddress" value="" size="50" maxlength="256" tabindex="5" />
        <br />
        <label for="password">Password</label>
        <input class="formInputText" type="text" name="password" id="password" value="" size="50" maxlength="256" tabindex="6" />
        <br />
        <input type="submit" value="Submit" />
       </fieldset>
      </form>
     </body>
    </html>
    
    Code (markup):
    Please help anyone?
     
    demondestiny, Nov 9, 2010 IP
  2. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #2
    try:
    
    <script type="text/javascript">
    window.onload = function() {
    document.getElementById("myForm").onsubmit = function() {
    var firstName = document.getElementById("firstName").value;
    var lastName = document.getElementById("lastName").value;
    var age = document.getElementById("age").value;
    var emailAddress = document.getElementById("emailAddress").value;
    var password = document.getElementById("password").value;
    
     if (firstName == null)
        {
        alert("Please enter your first name");
        return false;
        }
        else if (firstName == "")
        {
        alert("Nothing has been entered");
        return false;
        }
        else if (lastName == null)
        {
        alert("Please enter your last name");
        return false;
        }
        else if (lastName == "")
        {
        alert("Nothing has been entered");
        return false;
        }
        else if (age == null)
        {
        alert("Please enter your age");
        return false;
        }
        else if (age == "")
        {
        alert("Nothing has been entered");
        return false;
        }
        else if (age != parseInt(age))
        {
        alert("Age must be numeric");
        return false;
        }
        else if (emailAddress == null)
        {
        alert("Please enter your email address");
        return false;
        }
        else if (emailAddress == "")
        {
        alert("Nothing has been entered");
        return false;
        }
        else if (password == null)
        {
        alert("Please enter your password");
        return false;
        }
        else if (password == "")
        {
        alert("Nothing has been entered");
        return false;
        }
        return true;
    }}
    </script>
    
    Code (markup):
     
    camjohnson95, Nov 10, 2010 IP
  3. alex.stephen

    alex.stephen Peon

    Messages:
    1
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    @demondestiny
    You forgot to Declaring Variables, Function() and Conditional Statements "if and else if Thats why this form not validating ;) if you need any help then just PM me :)
     
    alex.stephen, Nov 10, 2010 IP