Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jan 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Help with Javascript form validator

    Hello.

    I have created a simple php form on <a href="http://iguanacreek.com/contactform.htm">this</a> page and have added a javascript validator to check for a name and email address. The validator works and the php page is correctly called up, however the email comes back with blank fields. I have double checked all field names and all are correctly referenced.

    The problem lies somewhere in the validator javascript code.

    Code:
    function isMailAddress(m) {
       if ((m == '') || (m == ' ')) { return false; }
    
        var a = 1;
        var ml = m.length;
    
        while ((ml>a) && (m.charAt(a) != "@")) { a++ }
        if ((a >= ml) || (m.charAt(a) != "@")) {
    	return false;
        } else {
    	a = a + 2;
        }
        while ((ml > a) && (m.charAt(a) != ".")) { a++ }
        if ((a >= ml - 1) || (m.charAt(a) != ".")) {
    	return false;
        } else {
        return true;
        }
    }
    
    // For Contact Form
    function validate(obj) {
    	var valid = true;
    	var msg = "";
    	
    	if (obj.elements["name"].value == "") {
    		msg += "Please enter your name.\n";
    		valid = false;
    		obj.elements["name"].focus();
    	}
    
    	if (!isMailAddress(obj.elements["email"].value)) {
    		msg += "Please enter a valid email address.\n";
    		if (valid) {
    			valid = false;
    		    obj.elements["email"].focus();
    		}
    	}
    		
    	if (!valid) alert(msg);
    
    	return valid;
    }
    The Firefox javascript console gives me the following error:

    [Exception... "'Permission denied to set property XULElement.selectedIndex' when calling method: [nsIAutoCompletePopup::selectedIndex]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "JS frame :: http://iguanacreek.com/validator.js :: validate :: line 40" data: no]
    [Break on this error] if (!valid) alert(msg);
    Does anyone know what this means? I've used the same base php form code and js validator code on many other web sites without any problems.

    Thanks in advance.

    Kelly W

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    That error is an error with the autocomplete built into the browser. If you search Google you will find more info.


    I think you should find a regular expression for an email address and avoid loops.

    how about testing stuff like

    a.a.a.a..a.a.a.a.a.a.a.a.a.......a@a@a@a@a@a@a.a.com.com.foobar

    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #3
    Banned
    Join Date
    Oct 2005
    Location
    I'm in GMT -5
    Posts
    314
    Thanks
    0
    Thanked 1 Time in 1 Post
    Kelly:

    Use onsubmit when validating a form:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Any Title</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    
    	function validate(nForm){
    
    		var nEmail = nForm['email'];
    		if (!/^\w+\-{0,1}\w+[\w|\.]{0,1}\w+\@\w+[\w|\-]{1,1}\w+\.{1,1}\w+[\w|\-]{1,1}\w+\.{0,1}\w*$/.test(nEmail.value))
    			{
    			 alert('Invalid Email');
    			 nEmail.value = "";
    			 nEmail.focus();
    			 return false;
    			}
    		if (nForm['comments'].value == "")
    			{
    			 alert('Please write a comment');
    			 return false;
    			}
    		if (nForm['recipient'].selectedIndex == 0)
    			{
    			 alert('Select a Recipient');
    			 return false;
    			}
    		alert('Thank you for your submission');
    		return true;
    	}
    	
    </script>
    <style type="text/css">
    
    	 body {background-color:#eae3c6;margin-top:60px}
    	 form {width:350px;margin:auto}
    	 fieldset {background-color:#f0fff0;border:1px solid #87ceeb}
    	 legend {font-family:georgia;font-size:14pt;color:#00008b;background-color:#87ceeb;padding-left:3px;padding-right:3px;margin-bottom:5px}
    	 label {font-family:times;font-size:12pt;color:#00008b;padding:5px;display:block}
    	 select {font-family:times;font-size:12pt;margin-left:40px}
    	.submitBtn {font-family:tahoma;font-size:10pt;display:block;margin-left:auto;margin-right:auto;margin-top:5px;margin-bottom:5px}
    	.comments {font-family:times:font-size:12pt;margin-left:42px;overflow:auto}
    	.emailAddr {font-family:times;font-size:12pt}
    
    </style>
    </head>
    	<body>
    		<form method="post" action="" onsubmit="return validate(this)">
    		   <fieldset>
    			<legend>Send a Comment</legend>
    				<label>Email: <input type='text' name='email' size='37' class='emailAddr' value='my_name-is.here@big_company-123.net' ></label>
    				<label>Comments:</label>
    					<textarea  rows='4' cols='31' name='comments' class='comments'></textarea>
    				<label>Recipient:
    					<select name='recipient'>
    						<option> Make a Selection</option>
    						<option> M. Jones </option>
    						<option> K. Smith </option>
    						<option> J. Doe </option>
    					</select>
    				</label>
    						
    					<input type='submit' name='submit' value="Submit" class='submitBtn'>
    		   </fieldset>
    		</form>
    	</body>
    </html>
    Last edited by Ancora; 01-03-2007 at 01:45 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •