JavaScript - Contact Form Validation Server And Client

I know that Javascript is client side, but I'd like to know the best way to populate HTML drop downs in real time based on information typed in the other HTML form fields with information found on the server as opposed to the client.

For instance if a user wants to select certain files located in a directory on the server, as they type in the pathname supposedly containing the files the drop downs continually refresh themselves with the server files listed in that directory (if it exists, and apache has permissions to see what's inside) as if it was showing client files instead.

What would be nice is if my browser could continually query the server for some of its private information and not have to refresh itself to obtain it, whether that means the server-side would have to continually refresh itself makes no difference to me as long as the client-side doesn't have to. But I guess this is not possible because no matter what you would have to at least refresh the client-side page once?

Submitting the form to a CGI or PHP script would not work because I need this functionality to help populate the form BEFORE I send it.

I would like to not have to press a button to update the form every time I change the pathname and need to update the drop downs since this would be annoying.

I'm open to anything that could do this or something similar not just Javascript. I'm not sure if you could accomplish this by converting the HTML page to CGI/PHP and having it continually reload itself without refreshing the page?

I'm not worried about any security risks this may pose because:
1) The server is located on company intranet which is firewalled
2) I could always password protect and encrypt all transmissions, making sure only authorized users use the app

I've literally tried everything. Read 26 tutorials, interchanged code, etc.

My validation functions all work. My AJAX functions work (tested manually using servlet URL's).

The second servlet validates the reCaptcha form that's generated on my webpage. After the form is validated, even if everything's correct, nothing happens upon clicking submit. I even have an alert pop up if with the captcha result, just for middle-layer debugging purposes.

I want to do all of my validation clientside; none serverside. However, going to be tough if I can't get my god damn form to submit. I've been puzzled by this for close to 36 hours straight. I can't see, and I'm going to get some rest and hope that there is some useful insight on my problem when I return.

html form:
Code:

<form id="f1" name="form1" onsubmit="validate_form(this); return false;" action="register" method="post">
        <table cellspacing="5" style="border: 2px solid black;">
            <tr>
                <td valign="top">
                    <table cellspacing="5">
                        <tr>
                            <td>*First name</td>
                            <td align="right"><span id="valid_one"></span></td>

                            <td><input type="text" style="width: 320px;" id="fn" name="fn" onBlur="validate_one();"></td>
                        </tr>
                        <tr>
                            <td align="left">*Last name</td>
                            <td align="right"><span id="valid_two"></span></td>

                            <td><input type="text" style="width: 320px;" id="ln" name="ln" onBlur="validate_two();"></td>
                        </tr>
                        <tr>
                            <td align="left">*Email address</td>
                            <td align="right"><span id="result"></span></td>

                            <td><input type="text" style="width: 320px;" id="mailfield" name="email" onBlur="startRequest();"></td>
                        </tr>
                        <tr>
                            <td align="left">*Phone number</td>
                            <td align="right"><span id="valid_three"></span></td>

                            <td><input type="text" style="width: 320px;" id="pn" name="pn" onBlur="validate_three();"></td>
                        </tr>
                        <tr>
                            <td align="left">*City/Town</td>
                            <td align="right"><span id="valid_four"></span></td>

                            <td><input type="text" style="width: 320px;" id="c" name="c" onBlur="validate_four();"></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td></td>
                            <td>
                                <select name="s">
                                    <option value="AL">Alabama
                                    <option value="AK">Alaska
                                    <option value="AZ">Arizona
                                    <option value="AR">Arkansas
                                    <option value="CA">California
                                    <option value="CO">Colorado
                                    <option value="CT">Connecticut
                                    <option value="DE">Delaware
                                    <option value="FL">Florida
                                    <option value="GA">Georgia
                                    <option value="HI">Hawaii
                                    <option value="ID">Idaho
                                    <option value="IL">Illinois
                                    <option value="IN">Indiana
                                    <option value="IA">Iowa
                                    <option value="KS">Kansas
                                    <option value="KY">Kentucky
                                    <option value="LA">Louisiana
                                    <option value="ME">Maine
                                    <option value="MD">Maryland
                                    <option value="MA">Massachusetts
                                    <option value="MI">Michigan
                                    <option value="MN">Minnesota
                                    <option value="MS">Mississippi
                                    <option value="MO">Missouri
                                    <option value="MT">Montana
                                    <option value="NE">Nebraska
                                    <option value="NV">Nevada
                                    <option value="NH">New Hampshire
                                    <option value="NJ">New Jersey
                                    <option value="NM">New Mexico
                                    <option value="NY">New York
                                    <option value="MC">North Carolina
                                    <option value="ND">North Dakota
                                    <option value="OH">Ohio
                                    <option value="OK">Oklahoma
                                    <option value="OR">Oregon
                                    <option value="PA">Pennsylvania
                                    <option value="RI">Rhode Island
                                    <option value="SC">South Carolina
                                    <option value="SD">South Dakota
                                    <option value="TN">Tennessee
                                    <option value="TX">Texas
                                    <option value="UT">Utah
                                    <option value="VT">Vermont
                                    <option value="VA">Virginia
                                    <option value="WA">Washington
                                    <option value="WV">West Virginia
                                    <option value="WI">Wisconsin
                                    <option value="WY">Wyoming
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <br>
                            </td>
                        </tr>
                        <tr>
                            <td></td>
                            <td></td>
                            <td><span id="error"></span></td>
                        </tr>
                        <tr>
                            <td valign="top">*Anti-Spam Verification</td>
                            <td></td>
                            <td id="reCaptcha"></td>
                        </tr>
                    </table>
                </td>
                <td valign="top">
                    <table cellspacing="5">
                        <tr>
                            <td align="left">*Affiliation</td>
                            <td align="right"><span id="valid_five"></span></td>

                            <td><input type="text" style="width: 320px;" id="affl" name="affl" onBlur="validate_five();"></td>
                        </tr>
                        <tr>
                            <td align="left">*Research Area:</td>
                            <td align="right"><span id="valid_six"></span></td>

                            <td><input type="text" style="width: 320px;" id="ra" name="ra" onBlur="validate_six();"></td>
                        </tr>
                        <tr>
                            <td valign="top" align="left">*Research Overview</td>
                            <td align="right"><span id="valid_seven"></span></td>

                            <td><textarea cols="38" rows="6" id="ro" name="ro" onKeyDown="limitText(this.form.ro,this.form.countdown,500)" onKeyUp="limitText(this.form.ro,this.form.countdown,500)" onBlur="validate_seven();"></textarea></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td></td>
                            <td><font size="1">You have <input readonly type="text" name="countdown" size="1" value="500"> characters remaining.</font></td>
                        </tr>
                        <tr>
                            <td align="left">*Talk Availability</td>
                            <td></td>
                            <td>
                                <input type="radio" name="ta" value="In person">In person
                                <input type="radio" name="ta" value="Online">Online
                                <input type="radio" name="ta" value="Both" checked>Both
                            </td>
                        </tr>
                        <tr>
                            <td align="left" valign="top">Links</td>
                            <td></td>
                            <td>
                                <table id="linkTable" border="0">
                                    <td><input type="text" style="width: 320px;" name="link"></td>
                                    <td><div id="result"></div></td>
                                </table>
                            </td>
                            <td align="left" valign="top"><input type="button" value="Add Link" onclick="addLink('linkTable')"></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td><span style="color: red;"></span></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <br />
        <input type="submit" id="submit" name="submit" value="Submit Form">
    </form>

Javascript file:
Code:

/* 
 * script.js - ajax and table functions
 */

var xmlHttp; // global instance of XMLHttpRequest
var xmlHttp2; // second for captcha functions

var validAjax = new Boolean();
var validCaptcha = new Boolean();

var valid_one = new Boolean();
var valid_two = new Boolean();
var valid_three = new Boolean();
var valid_four = new Boolean();
var valid_five = new Boolean();
var valid_six = new Boolean();
var valid_seven = new Boolean();

function init() {
    showRecaptcha('reCaptcha');

    // Separate booleans for AJAX funcs
    validAjax = false;
    validCaptcha = false;

    // Booleanse for fields that don't require servlet validation
    valid_one = false;
    valid_two = false;
    valid_three = false;
    valid_four = false;
    valid_five = false;
    valid_six = false;
    valid_seven = false;
}

function showRecaptcha(element) {
    Recaptcha.create("6Le1a8ESAAAAAGtxX0miZ2bMg0Wymltnth7IG-Mj", element, {theme: "red", callback: Recaptcha.focus_response_field});
}

function validate_form() {
    if (valid_one && valid_two && valid_three && valid_four && validEmail) {
        startCaptchaRequest();

        if (validCaptcha) {
            return true;
        }
    }
    else {
        alert("Submission contains errors. Please fill out all required fields before submitting.");
        return false;
    }
}

function validate_one() {
    if (document.getElementById("fn").value == 0) {
        valid_one = false;
        document.getElementById("valid_one").innerHTML = "No";
    }
    else {
        valid_one = true;
        document.getElementById("valid_one").innerHTML = "";
    }
}

function validate_two() {
    if (document.getElementById("ln").value == 0) {
        valid_two = false;
        document.getElementById("valid_two").innerHTML = "No";
    }
    else {
        valid_two = true;
        document.getElementById("valid_two").innerHTML = "";
    }
}

function validate_three() {
    if (document.getElementById("pn").value == 0) {
        valid_three = false;
        document.getElementById("valid_three").innerHTML = "No";
    }
    else {
        valid_three = true;
        document.getElementById("valid_three").innerHTML = "";
    }
}

function validate_four() {
    if (document.getElementById("c").value == 0) {
        valid_four = false;
        document.getElementById("valid_four").innerHTML = "No";
    }
    else {
        valid_four = true;
        document.getElementById("valid_four").innerHTML = "";
    }
}

function validate_five() {
    if (document.getElementById("affl").value == 0) {
        valid_five = false;
        document.getElementById("valid_five").innerHTML = "No";
    }
    else {
        valid_five = true;
        document.getElementById("valid_five").innerHTML = "";
    }
}
//
//function validate_six() {
//    if (document.getElementById("ra").value == 0) {
//        valid_six = false;
//        document.getElementById("valid_six").innerHTML = "No";
//    }
//    else {
//        valid_six = true;
//        document.getElementById("valid_six").innerHTML = "";
//    }
//}
//
//function validate_seven() {
//    if (document.getElementById("ro").value == 0) {
//        valid_seven = false;
//        document.getElementById("valid_seven").innerHTML = "No";
//    }
//    else {
//        valid_seven = true;
//        document.getElementById("valid_seven").innerHTML = "";
//    }
//}

function addLink(tableID) {
    var table = document.getElementById(tableID);

    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var cell = row.insertCell(0);
    var element1 = document.createElement("input");

    element1.type = "text";
    element1.name = "link" + rowCount;
    element1.style.width = "320px";

    cell.appendChild(element1);
}

function limitText(limitField, limitCount, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    }
    else {
        limitCount.value = limitNum - limitField.value.length;
    }
}

function createXmlHttpRequest() {
    if(window.ActiveXObject) {
        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if(window.XMLHttpRequest) {
        xmlHttp=new XMLHttpRequest();
    }
}

function startRequest() {
    createXmlHttpRequest();
    
    var param1 = document.getElementById('mailfield').value;

    if (param1 == "") {
        validEmail = false;
        document.getElementById("result").innerHTML = "Blank";
    }
    else {
        xmlHttp.open("GET", "http://localhost:1979/PolarSpeakers/servlet/mailCheck.do?e=" + param1, true)
        xmlHttp.onreadystatechange = handleStateChange;
        xmlHttp.send(null);
    }
}

function handleStateChange() {
    if(xmlHttp.readyState==4) {
        if(xmlHttp.status==200) {
            var message =
                xmlHttp.responseXML
                .getElementsByTagName("valid")[0]
                .childNodes[0].nodeValue;
            
            if (message == "Unregistered") {
                validEmail = true;
                document.getElementById("result").style.color = "green";
            }
            else {
                validEmail = false;
                document.getElementById("result").style.color = "red";
            }

            document.getElementById("result").innerHTML = message;
        }
        else {
            alert("Error checking e-mail address - " + xmlHttp.status +
                " : " + xmlHttp.statusText);
        }
    }
}
function createCaptchaRequest() {
    if(window.ActiveXObject) {
        xmlHttp2=new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if(window.XMLHttpRequest) {
        xmlHttp2=new XMLHttpRequest();
    }
}

function startCaptchaRequest() {
    alert('made it to captcha requeswt');
    createCaptchaRequest();

    var param1 = Recaptcha.get_challenge();
    var param2 = Recaptcha.get_response();

    xmlHttp2.open("POST", "http://localhost:1979/PolarSpeakers/servlet/captchaCheck.do?c=" + param1 + "&r=" + param2, true)
    xmlHttp2.onreadystatechange = handleStateChangeCaptcha;
    xmlHttp2.send(null);
}

function handleStateChangeCaptcha() {
    if(xmlHttp2.readyState==4) {
        if(xmlHttp2.status==200) {
            var message =
                xmlHttp2.responseXML
                .getElementsByTagName("result")[0]
                .childNodes[0].nodeValue;

            if (message == "Valid") {
                alert("captcha valid");
                validCaptcha = true;
            }
            else {
                document.getElementById("error").innerHTML = message;
                validCaptcha = false;
            }
        }
        else {
            alert("Error checking captcha validity - " + xmlHttp2.status +
                " : " + xmlHttp2.statusText);
        }
    }
}

Hi,
The following code is not working whose purpose is to validate the form with javascript. Please Help .

Code:

<html>
<head>
<script type='text/javascript'>

function formValidator()
{
	// Make quick references to our fields
	var firstname = document.getElementById('firstname');
	var addr = document.getElementById('addr');
	var zip = document.getElementById('zip');
	var state = document.getElementById('state');
	var username = document.getElementById('username');
	var password = document.getElementById('passwd');
	var email = document.getElementById('email');
	var cpassword=document.getElementById('pass2');
	var txtar=document.getElementById('ta');
	var rad=document.getElementById('r1');
	 var cbox  =document.getElementById('r1');
	// Check each input in the order that it appears in the form!
	if(isAlphabet(firstname, "Please enter only letters for your name"))
	{
		if(isAlphanumeric(addr, "Numbers and Letters Only for Address"))
		{
			if(isNumeric(zip, "Please enter a valid zip code"))
			{
				if(madeSelection(state, "Please Choose a State"))
				{
					if(lengthRestriction(username, 6, 8))
					{
					 if(plengthRestriction(password,4,6))
					 {
					   if(confpass(cpassword,"Please confirm"))
					    {
						if(emailValidator(email, "Please enter a valid email address"))
						{
						 if(istextareablank(txtar,"Please enter some text"))
						 {
						  if(isradiobuttselected(rad,"Please select any one radio buttons"))
						  {
						 if(ischeckboxselected(cbox,"Please select at least one checkbox"))
						 {
							return true;
						}
					  }
				    }
			    }
		    }
	    }
	}
  }
	}
	  }
	   }
	 return false;
	
}

function notEmpty(elem, helperMsg){
	if(elem.value.length === 0){
		alert(helperMsg);
		elem.focus(); // set the focus to this input
		return false;
	}
	return true;
}

function isNumeric(elem, helperMsg){
	var numericExpression = /^[0-9]+$/;
	if(elem.value.match(numericExpression)){
		return true;
	}else{
		alert(helperMsg);
		elem.focus();
		return false;
	}
}

function isAlphabet(elem, helperMsg){
	var alphaExp = /^[a-zA-Z]+$/;
	if(elem.value.match(alphaExp)){
		return true;
	}else{
		alert(helperMsg);
		elem.focus();
		return false;
	}
}

function isAlphanumeric(elem, helperMsg){
	var alphaExp = /^[0-9a-zA-Z]+$/;
	if(elem.value.match(alphaExp)){
		return true;
	}else{
		alert(helperMsg);
		elem.focus();
		return false;
	}
}

 function lengthRestriction(elem, min, max)
 {
	var uInput = elem.value;
	if(uInput.length >= min && uInput.length <= max){
		return true;
	}else{
		alert("Please enter username between " +min+ " and " +max+ " characters");
		elem.focus();
		return false;
	}
  }

 function plengthRestriction(elem, min,max)
 {
	var uInput = elem.value;
	if(uInput.length >= min && uInput.length <= max){
		return true;
	}else{
		alert("Please enter password between " +min+ " and " +max+ " characters");
		elem.focus();
		return false;
	}
  }


function madeSelection(elem, helperMsg){
	if(elem.value == "Please Choose"){
		alert(helperMsg);
		elem.focus();
		return false;
	}else{
		return true;
	}
}

function emailValidator(elem, helperMsg){
	var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
	if(elem.value.match(emailExp)){
		return true;
	}else{
		alert(helperMsg);
		elem.focus();
		return false;
	}
}

  function confpass(elem,helperMsg)
   		{ 
               if ( confPasswd === "" )
			    {
					alert("Please fill in the Confirm Password");
					document.forms[0].elements[7].focus( );
					return false;
				}
				else if (document.forms[0].elements[6].value != document.forms[0].elements[7].value) 
				 {
					alert( "Your passwords do not match. Please retype and try again.");
					return false;
				  }
		}
		
		function isEmpty(s) {
			return ((s === null) || (s.length === 0));
		}

 function istextareablank(elem,helperMsg){
    var i;
		<!-- Is  empty?  -->
			 if (isEmpty(s)) return true;
		<!-- Search through string's' characters one by one until we find a non-whitespace character. -->
			for (i=0; i < s.length; i++) {
			<!-- Check that current character isn't' whitespace.-->
				var currchar = s.charAt(i);
				if (whitespace.indexOf(currchar) == -1)
					return false;
				}
		<!-- All characters are whitespace. -->
			 return true;
     }

  function isradiobuttselected(elem,helperMsg){
   <!-- Check to see if atleast one is checkbox checked or not-->
				for (j=10; j<=11; j++) {
					if(document.forms[0].elements[j].checked) {
						break;
				}
 
				else if (j>=11) {	
					alert("Atleast Check on one of the radio buttons");
					document.forms[0].elements[j].focus();
					return (false);
				}
			}	
			return(true);
		}
   
   function ischeckboxselected(elem,helperMsg)
   {
    for (j=12; j<=13; j++) {
					if(document.forms[0].elements[j].checked) {
						break;
				}
 
				else if (j>=13) {	
					alert("Atleast Check on One of Our Services");
					document.forms[0].elements[j].focus();
					return (false);
				}
			}	
			return(true);
		}
	
   
</script>
</head>
<body>
<form onsubmit='return formValidator()' >
<br />
First Name: <input type='text' id='firstname' /><br /><br />
Address: <input type='text' id='addr' /><br /><br />
Zip Code: <input type='text' id='zip' /><br /><br />
State: <select id='state'>
	<option>Please Choose</option>
	<option>AL</option>
	<option>KE</option>
	<option>TX</option>
	<option>CH</option>
</select><br />
Username(6-8 characters): <input type='text' id='username' /><br /><br />
Password(min 4 chars):<input type="password" id='passwd' />  <br/><br />
Confirm Password: <input id="pass2" Type="password" /><br/><br />
Email: <input type='text' id='email' /><br /><br />

Something 
about Yourself :   <textarea name="1" cols="17" rows="4" id="ta"></textarea><br/><br />

Free Membership 
<input type="radio" id="r1"/> Paid Membership <input type="radio" id="r1"/><br/><br/>
Friendship<input type="checkbox" id="box1" /> Networking <input type="checkbox" id="box1" /><br /><br />

<input type='submit' value='Submit' />
</form>
</body>
</html>

i cant see to get my finger on the validation correctly, im trying to achieve that:

(*) Required fields are required in the final submission
All other fields are validated by their content type
But all fields without (*) Required are not needed for the form to be submitted

http://www.on-media.co.uk/clients/hlmd/

http://www.on-media.co.uk/clients/hl...ipt/contact.js

is the below code:

Code:

function formValidator(){
    // Make quick references to our fields
    var name = document.getElementById('name');
    var sname = document.getElementById('sname');
    var phone = document.getElementById('phone');
    var cell = document.getElementById('cell');
    var calltime = document.getElementById('calltime');
    var email = document.getElementById('email');
    var address = document.getElementById('address');
    var zip = document.getElementById('zip');
    var loana = document.getElementById('loana');
    var loanb = document.getElementById('loanb');
    var balance = document.getElementById('balance');

    
    // Check each input in the order that it appears in the form!
    if(isAlphabet(name, "Please enter only letters for your name")){
        if(isAlphabet(sname, "Please enter only letters for your surname")){
            if(isNumeric(phone, "please enter only numbers for your phone number")){
                if(isNumeric(cell, "please enter only numbers for your cell number")){
                    if(madeSelection(calltime, "Please select a time for your callback")){
                        if(isAlphanumeric(address, "please enter your address in numbers and letters")){
                            if(isNumeric(zip, "Please enter a valid zip code")){
                                if(emailValidator(email, "Please enter a valid email address")){
                                    if(isAlphanumeric(loana, "Please enter the value of your loan")){
                                        if(isAlphanumeric(loanb, "Please enter the value of your loan")){
                                            if(madeSelection(balance, "Select the duration you are behind on your loan re-payments")){
                                                return true;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    return false;
    
}
function notEmpty(elem, helperMsg){
    if(elem.value.length == 0){
        alert(helperMsg);
        elem.focus(); // set the focus to this input
        return false;
    }
    return true;
}

function isNumeric(elem, helperMsg){
    var numericExpression = /^[0-9]+$/;
    if(elem.value.match(numericExpression)){
        return true;
    }else{
        alert(helperMsg);
        elem.focus();
        return false;
    }
}

function isAlphabet(elem, helperMsg){
    var alphaExp = /^[a-zA-Z]+$/;
    if(elem.value.match(alphaExp)){
        return true;
    }else{
        alert(helperMsg);
        elem.focus();
        return false;
    }
}

function isAlphanumeric(elem, helperMsg){
    var alphaExp = /^[0-9a-zA-Z]+$/;
    if(elem.value.match(alphaExp)){
        return true;
    }else{
        alert(helperMsg);
        elem.focus();
        return false;
    }
}

function madeSelection(elem, helperMsg){
    if(elem.value == "Please Choose"){
        alert(helperMsg);
        elem.focus();
        return false;
    }else{
        return true;
    }
}

function emailValidator(elem, helperMsg){
    var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
    if(elem.value.match(emailExp)){
        return true;
    }else{
        alert(helperMsg);
        elem.focus();
        return false;
    }
}

is my form:

Code:

<form onsubmit='return formValidator()' ><div id="contactfC">
<div id="contactf1">
  <table width="240" border="0">
    <tr>
      <td width="102"><span style="color:#F00;">*</span>Name:</td>
      <td width="108"><input name="name" type="text" id="name" size="15" /></td>
      </tr>
    <tr>
      <td><span style="color:#F00;">*</span>Surname:</td>
      <td><input name="sname" type="text" id="sname" size="15" /></td>
      </tr>
    <tr>
      <td><span style="color:#F00;">*</span>Phone Number:</td>
      <td><input name="phone" type="text" id="phone" size="15" /></td>
      </tr>
    <tr>
      <td>Cell Number:</td>
      <td><input name="cell" type="text" id="cell" size="15" /></td>
      </tr>
    <tr>
      <td>Best time to call:</td>
      <td><select name="calltime" id="calltime">
        <option value="Morning">Morning</option>
        <option value="Afternoon">Afternoon</option>
        <option value="Evening">Evening</option>
        <option value="Anytime">Anytime</option>
        <option value="Please Choose" selected="selected">Please Choose</option>
      </select></td>
      </tr>
    <tr>
      <td>Address:</td>
      <td><textarea name="address" id="address" cols="15" rows="3"></textarea></td>
      </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </table>
</div>
<div id="contactf2">
  <table width="245" border="0">
    <tr>
      <td width="133"><span style="color:#F00;">*</span>Zip Code:</td>
      <td width="118"><input name="zip" type="text" id="zip" size="15" /></td>
      </tr>
    <tr>
      <td><span style="color:#F00;">*</span>Email:</td>
      <td><input name="email" type="text" id="email" size="15" /></td>
      </tr>
    <tr>
      <td><span style="color:#F00;">*</span>1st Loan Amount:</td>
      <td><input name="loana" type="text" id="loana" size="15" /></td>
      </tr>
    <tr>
      <td>2nd Loan Amount:</td>
      <td><input name="loanb" type="text" id="loanb" size="15" /></td>
      </tr>
    <tr>
      <td><span style="color:#F00;">*</span>Balance Past Due:</td>
      <td><select name="balance" id="balance">
        <option value="One Month">1 Month</option>
        <option value="Two Months">2 Months</option>
        <option value="Three Months">3 Months</option>
        <option value="Four Months">4 Months</option>
        <option value="Five Months +">5 Months +</option>
        <option value="Not Applicable">N/A</option>
        <option value="Please Choose" selected="selected">Please Choose</option>
      </select></td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td><input type="submit" name="button" id="button" value="Submit" /></td>
    </tr>
  </table>
</div>
</div></form>

i appricate any help thanks

Hi Everybody. i have a contact form here

PHP Code:
<form id="form1" method="post" action="/contact.php" onsubmit="return validate(this)"> 
           
 
     
          <p> 
            <label for="name">Name:</label> 
            <input type="text" name="name" id="name" /> 
            <img src="alert.gif" alt="" class="alertImg" /> 
        </p> 
                         
                    
                         
        <p> 
            <label for="number">Mobile:</label> 
            <input type="text" name="number" id="number" /> 
            <img src="alert.gif" alt="" class="alertImg" /> 
        </p> 
                 
                     
        <p> 
            <label for="email">Email:</label> 
            <input type="text" name="email" id="email" /> 
            <img src="alert.gif" alt="" class="alertImg" /> 
        </p> 
                                            
        <p> 
            <label for="msg">Comments:</label> 
            <textarea name="msg" id="msg" cols="30" rows="3"></textarea> 
            <img src="alert.gif"  alt=""class="alertImg" /> 
        </p> 
                
                    
                 
                                
 
            <p>    <input class="submit_btn" type="image" src="images/submit_btn.gif" name="submit" value="Submit"  /></p> 
<!--    -->    
                   
        </form> 


and i have an external js script to validate the form and the code is below



PHP Code:
var alertImgs = [];    
    var nImage = "";

    function validate(nForm){

        for (i=0; i<alertImgs.length; i++)
            {
             nImage[alertImgs[i]].style.visibility = "hidden";
            }
        var nName = nForm['name'];
        var nMobile = nForm['number'];
        var nEmail = nForm['email'];
        if (nFirstName.value.replace(/s/g, "").length < 1)
            {
             alert('Please Enter Your Name');
              document.images[alertImgs[0]].style.visibility = "visible";    
             return false;
            }
        
        if (!/[ds-]+$/.test(nmobile.value) || !/d{10}/.test(nmobile.value.replace(/[s-]/g, ""))) // must contain 10 digits;
            {
             alert('Enter your mobile phone number');    
             document.images[alertImgs[2]].style.visibility = "visible";
             return false;
            }        
        if (!/^w+[w|.|-]{0,1}w*[w|.|-]{0,1}w*@w+[w|-]{0,1}w*[w|-]{0,1}w*.{1,1}[a-z]{2,4}$/.test(nEmail.value))
            {
             alert('Invalid Email');
             document.images[alertImgs[3]].style.visibility = "visible";
             return false;
            }
        if (nForm['msg'].value == "")
            {
             alert('Please write a comment');
             document.images[alertImgs[4]].style.visibility = "visible";
             return false;
            }
        alert('Thank you for your submission');
        return true;
    }

    function init(){

        nImage = document.images;
        var imgFileName = "";
        for (i=0; i<nImage.length; i++)
            {
             imgFileName = nImage[i].src;
             imgFileName = imgFileName.substring(imgFileName.lastIndexOf("/")+1,imgFileName.length)
             if (imgFileName == "alert.gif")
                {
                 alertImgs[alertImgs.length] = i;
                 nImage[i].style.visibility = "hidden";
                }    
            }
    }

    navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false); 


Could anyone tell me why it wont work for me and is there any problem with the code?

Thanks for your help if you give some