Question

I’ve looked over the documentation for the validation plugin and I can’t figure out for the life of me what is wrong with my form/javascript. I load the plugin after I load Jquery, and to my knowledge I didn’t leave anything out. But the page biases the Javascript and goes straight to the action page. I am using Jquery 1.6.2 Any ideas why?

Javascript:

 $("#regForm").validate({
     rules: {
         pass: "required",
         passChk: {
             equalTo: "#pass"
         }
     },
     submitHandler: function(form) {
         form.submit();
     }
});

HTML/CFML:

   <cfform type="actionForm" action="Action.cfm" id="regForm" method="post" data-ajax="false">    
       <label for="email">E-mail</label>
       <cfinput type="text" label="E-mail" name="email" id="email" class="required email"><br>          
       <label for="pass">password</label>
       <cfinput type="password" name="pass" id="pass" class="required" ><br>
       <label for="passChk">enter password again</label>
       <cfinput type="password" name="passChk" id="passChk" class="required" > <br>                
       <label for="fName">First Name</label>
       <cfinput type="text" name="fName" id="fName" class="required"><br>
       <label for="lName">Last Name</label>
       <cfinput type="text" name="lName" id="lName" class="required"><br>         
       <cfinput type="submit" name="submit" value="register" data-inline="true">
   </cfform>

Answer 1

This is working fine for me. I wonder though. I did have a problem when I tried to use the jquery validate JS file from the CDN on the demo pages.

http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js

When I tried to use this one I would sometimes get a 403. So sometimes the validation would work and sometimes not.

When I switched to the proper CDN

http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.js

It worked fine every time. I wonder if you are doing the same thing.

Also, make sure you are not running this script until the DOM is ready.

<script>
    $(function(){
        $("#regForm").validate({
                    rules: {
                            pass: "required",
                            passChk: {
                                 equalTo: "#pass"
                            }
                    },
                    submitHandler: function(form) {
                            $(form).submit();
                    }
            });
    });
</script>