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 4 of 4

Thread: form validation

  1. #1
    New Coder
    Join Date
    Oct 2011
    Posts
    85
    Thanks
    13
    Thanked 1 Time in 1 Post

    form validation

    Hey all,
    I'm new to validating forms, so I'm trying to use jquery to do so. So far I have

    Code:
    <script type="text/javascript">
    jQuery.noConflict();
    var jQ = jQuery;
    
    jQ(document).ready(
    	jQ("#register").validate({
      		rules: {
        		    email1: {
          			required: true,
          			email: true
        		    },
    		    email2: {
    				required: true,
    				email:true
    		    }
      		},
    		messages: {
    			email1:{
    				required: "Required",
    				email: "Must be a valid email"
    			},
    			email2:{
    				required: "Required",
    				email: "Must be a valid email"
    			}
    		}
    	})
    );
    
    </script>
    </head>
    
    
    
    <body>
    
    
    
    <div id="createDiv" class="left loginBox" style="overflow:hidden;">
    
    <form id="register" name="register" action="" method="post">
    
    <legend>Register for a new Account</legend>
    
    <fieldset style="border:0px; margin:0px; padding:0px;">
    
    <div style="float:left; margin-right:15px;">
    	<p>
    	<label for="email1">Email Address:</label><br style="margin-top:0px;"/>
    	<input type="text" id="email1" name="email1"  style="width:200px"/>
    	</p>
    
    	<p>
    	<label for="pass1">Create Password:</label><br style="margin-top:0px;"/>
    	<input type="password" id="pass1" name="pass1" class="required" style="width:200px"/>
    	</p>
    </div>
    
    
    <div style="float:right;">
    	<p>
    	<label for="email2">Confirm Email Address:</label><br style="margin-top:0px;"/>
    	<input type="text" id="email2" name="email2" style="width:200px"/>
    	</p>
    
    	<p>
    	<label for="pass2">Confirm Password:</label><br style="margin-top:0px;"/>
    	<input type="password" id="pass2" name="pass2" class="required" style="width:200px"/>
    	</p>
    </div>
    
    <div style="clear:both;"></div><br/>
    
    <input style="padding:5px 10px;" class="submit" type="submit" id="createSubmit" name="createSubmit" value="Create Account"/>
    
    </fieldset>
    
    </form>
    I had it working when I only used validate and used classes to determine the rules. since this is really limited, I am trying to get away from that, but I can't figure out what I'm doing wrong. any help would be appreciated.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    If you are using jQuery you would do better to post in the jQuerty forum.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    New Coder
    Join Date
    Dec 2010
    Posts
    32
    Thanks
    5
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by footballer27 View Post
    Hey all,
    I'm new to validating forms, so I'm trying to use jquery to do so. So far I have

    Code:
    <script type="text/javascript">
    jQuery.noConflict();
    var jQ = jQuery;
    
    jQ(document).ready(
    	jQ("#register").validate({
      		rules: {
        		    email1: {
          			required: true,
          			email: true
        		    },
    		    email2: {
    				required: true,
    				email:true
    		    }
      		},
    		messages: {
    			email1:{
    				required: "Required",
    				email: "Must be a valid email"
    			},
    			email2:{
    				required: "Required",
    				email: "Must be a valid email"
    			}
    		}
    	})
    );
    
    </script>
    </head>
    
    
    
    <body>
    
    
    
    <div id="createDiv" class="left loginBox" style="overflow:hidden;">
    
    <form id="register" name="register" action="" method="post">
    
    <legend>Register for a new Account</legend>
    
    <fieldset style="border:0px; margin:0px; padding:0px;">
    
    <div style="float:left; margin-right:15px;">
    	<p>
    	<label for="email1">Email Address:</label><br style="margin-top:0px;"/>
    	<input type="text" id="email1" name="email1"  style="width:200px"/>
    	</p>
    
    	<p>
    	<label for="pass1">Create Password:</label><br style="margin-top:0px;"/>
    	<input type="password" id="pass1" name="pass1" class="required" style="width:200px"/>
    	</p>
    </div>
    
    
    <div style="float:right;">
    	<p>
    	<label for="email2">Confirm Email Address:</label><br style="margin-top:0px;"/>
    	<input type="text" id="email2" name="email2" style="width:200px"/>
    	</p>
    
    	<p>
    	<label for="pass2">Confirm Password:</label><br style="margin-top:0px;"/>
    	<input type="password" id="pass2" name="pass2" class="required" style="width:200px"/>
    	</p>
    </div>
    
    <div style="clear:both;"></div><br/>
    
    <input style="padding:5px 10px;" class="submit" type="submit" id="createSubmit" name="createSubmit" value="Create Account"/>
    
    </fieldset>
    
    </form>
    I had it working when I only used validate and used classes to determine the rules. since this is really limited, I am trying to get away from that, but I can't figure out what I'm doing wrong. any help would be appreciated.
    You can read more here:
    http://bassistance.de/jquery-plugins...in-validation/
    cheers,

  • #4
    New Coder
    Join Date
    Oct 2011
    Posts
    85
    Thanks
    13
    Thanked 1 Time in 1 Post
    sorry, didn't realize there was a forum for jquery. I'll post there. and please don't tell me to go to some site. I've already been there. I'm still stuck. anyway, I'll post this in the framework forum


  •  

    Posting Permissions

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