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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Location
    Indiana
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post JavaScript Form Validation Chooses Issues

    Code:
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script type='text/javascript'>
    
    function myForm(){
    	// Make quick references to our fields
    	var fname = document.getElementById('fname');
    	var lname = document.getElementById('lname');
    	var address = document.getElementById('address');
    	var city = document.getElementById('city');
    	var state = document.getElementById('state');
    	var zcode = document.getElementById('zcode');
    	var email = document.getElementById('email');
    	
    	// Check each input in the order that it appears in the form!
    	if(isAlphabet(fname, "Please enter only letters for your first name")){
    		if(isAlphabet(lname, "Please enter only letters for your last name")){
    			if(isAlphanumeric(address, "Numbers and Letters Only for Address")){
    				if(isAlphabet(city, "Please enter only letters for your city name")){
    					if(madeSelection(state, "Please Choose a State")){
    						if(isNumeric(zcode, "Please enter a valid zip code")){
    							if(emailValidator(email, "Please enter a valid email address")){
    								return true;
    							}
    							}
    						}
    					}
    				}
    			}
    		}
    
    	
    	return false;
    }
    
    function formChoice(elem, helperMsg){
    	if(elem.fname, elem.lname, elem.address, elem.city, elem.state, elem.zcode == 0 || elem.email == 0){
    		return true;
    	}else{
    		alert(helperMsg);
    		elem.focus();
    		return flase;
    	}
    }
    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\s]+$/;
    	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;
    	}
    }
    </script>
    </head>
    
    <body>
    <p>My Form.</p>
    <form action="conformation.html" target="_self" onsubmit="return myForm()">
    <fieldset>
      <legend>Name</legend>
      First Name:
      <input type="text" id="fname" value="" />
      <br />
      Last Name:
      <input type="text" id="lname" value="" />
      <br />
    </fieldset>
    <br />
    <fieldset>
      <legend>Address</legend>
      Address:
      <input type="text" id="address" value="" />
      <br />
      City:
      <input type="text" id="city" value="" />
      <br />
      State:
      <select id="state">
        <option>Please Choose</option>
        <option>AL</option>
        <option>AK</option>
        <option>AZ</option>
        <option>AR</option>
        <option>CA</option>
        <option>CO</option>
        <option>CT</option>
        <option>DE</option>
        <option>FL</option>
        <option>GA</option>
        <option>HI</option>
        <option>ID</option>
        <option>IL</option>
        <option>IN</option>
        <option>IA</option>
        <option>KS</option>
        <option>KY</option>
        <option>LA</option>
        <option>ME</option>
        <option>MD</option>
        <option>MA</option>
        <option>MI</option>
        <option>MN</option>
        <option>MS</option>
        <option>MO</option>
        <option>MT</option>
        <option>NE</option>
        <option>NV</option>
        <option>NH</option>
        <option>NJ</option>
        <option>NM</option>
        <option>NY</option>
        <option>NC</option>
        <option>ND</option>
        <option>OH</option>
        <option>OK</option>
        <option>OR</option>
        <option>PA</option>
        <option>RI</option>
        <option>SC</option>
        <option>SD</option>
        <option>TN</option>
        <option>TX</option>
        <option>UT</option>
        <option>VT</option>
        <option>VA</option>
        <option>WA</option>
        <option>WV</option>
        <option>WI</option>
        <option>WY</option>
      </select>
      <br />
      Zip Code:
      <input type="text" id="zcode" value="" />
      <br />
    </fieldset>
    <br />
    <br />
    <fieldset>
      <legend>E-mail Address</legend>
      E-mail Address:
      <input type="text" id="email" value="" />
      <br />
    </fieldset>
    <input type="submit" value="Submit" />
    </form>
    </body>
    </html>
    Hello Everyone - I am trying to make a form that requires a user to either enter in their mailing address and or e-mail or both. For example, if somebody only enters in their e-mail address the form would validate correctly and send the validation information to a conformation page. Or, the other s scenario would be they entered their mailing address information but left the e-mail field blank, the form would validate and confirm the form information on a conformation page. Or the last scenario would be that all fields were filled out, which then wouldn't be an issue(my form does this now).

    What I have done was made a custom function, which is in the code above on line, 39 and then have it called on an onsubmit button but that wasn't working.
    Code here:
    Code:
    function formChoice(elem, helperMsg){
    	if(elem.fname, elem.lname, elem.address, elem.city, elem.state, elem.zcode == 0 || elem.email == 0){
    		return true;
    	}else{
    		alert(helperMsg);
    		elem.focus();
    		return flase;
    	}
    }
    The other thing I tried to do was making the if on line 25 an else if else and or just an else. I understand with an else if the condition are not met than the if statement moves on to the else and if that isn't met then both statements are false and the form will not submit, but both else if else, and else doesn't work at line 25. I tried moving the line 25 e-mail line down past the brackets and that didn't work.

    I have read many books and have visited many sites to try on my own to learn how to do this, and I think I am not understanding some basic concepts, and I would be tickled if somebody could look at my code and look at my problem and see what knowledge I am missing and how to fix my problem.

    Thanks.

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    From all of your reading ... where did you get this construct from?
    Code:
    if(elem.fname, elem.lname, elem.address, elem.city, elem.state, elem.zcode == 0
    What did you want to achieve with this? If you want to find out if all of those values are 0, then you have to write it that way
    Code:
    if(elem.fname == 0 && elem.lname == 0 && elem.address == 0 && elem.city == 0 && elem.state == 0 && elem.zcode == 0

  • #3
    New to the CF scene
    Join Date
    Jan 2012
    Location
    Indiana
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    Quote Originally Posted by devnull69 View Post
    From all of your reading ... where did you get this construct from?
    Code:
    if(elem.fname, elem.lname, elem.address, elem.city, elem.state, elem.zcode == 0
    What did you want to achieve with this? If you want to find out if all of those values are 0, then you have to write it that way
    Code:
    if(elem.fname == 0 && elem.lname == 0 && elem.address == 0 && elem.city == 0 && elem.state == 0 && elem.zcode == 0
    Ok, all I want to do is either have the user submit their name and address or name and e-mail. What did I not do.

    The function above you quoted was a poor way of trying to solve this problem. HELP.

  • #4
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    Your description virtually is a representation of the resulting code

    Either name and address OR name and email. So the name (fname AND lname I suppose) must always be given. Depending on that, either address OR email must be there (not empty)

    Code:
    if(fname && lname) {
       if(address || email) {
          // this is where everything needed is provided
          ...
       } else {
          alert('Please give either address or email');
       }
    } else {
       alert('Please give a full name');
    }

  • #5
    New to the CF scene
    Join Date
    Jan 2012
    Location
    Indiana
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you very much, that helps a lot.


  •  

    Posting Permissions

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