0

J Query form validation disables whole JQuery Code.I made a simple validation form using J Query. It's not working. i have tried http://jsfiddle.net/4PuJL/165/ and working fine, but not working on my computer.

<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-2.0.0.min.js"></script>
<script src="http://malsup.github.io/jquery.form.js"></script>
<script src="http://http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<script type="text/javascript">         
    $(document).ready(function(){
     $("#p1").mousedown(function () {
            alert("Mouse down over p1!");
        });       
        $("#personDetailForm").validate({
            rules: {
                persname: {
                    required: true,
                    regex: /^[A-Za-z]+$/
                }
            }
            submitHandler: function() {                        
                alert("alert");
            }
        });        
    });
    </script>
   </head>
 <body>        
  <p id="p1">This is a paragraph.</p>
  <form id="personDetailForm" action="showDetails.html" method="post"  novalidate="novalidate" >
  <p>
    Name:
  <input type="text" name="persname" id="persname" maxlength="50"></p><br>
  Password:
  <input type="password" name="perspswd" id="perspswd"><br>
  <input type="reset" value="Reset">
  <button type="submit">Submit</button>  
  </form>
  <span></span>
 </body>
</html>

if i remove below part,then first alert starts working

$("#personDetailForm").validate({
  rules: {
  persname: {
  required: true,
  regex: /^[A-Za-z]+$/
  }
 }
 submitHandler: function() {                        
 alert("alert");
 }
});   
2

3 Answers 3

1
$("#personDetailForm").validate({
   rules: {
      persname: {
         required: true,
         regex: /^[A-Za-z]+$/
      }
   }
   submitHandler: function() {                        
      alert("alert");
   }
});  

Should be a , between rules and submitHandler.

You don't have the submitHandler part in your fiddle, that's why it's working.

Sign up to request clarification or add additional context in comments.

1 Comment

Glad to help. Welcome to stackoverflow! :) If an answer has helped you please mark it as accepted. Thanks
0

There are actually three problems...

  1. Your script include for this plugin erroneously has http:// written out twice.

    src="http://http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"
    
  2. There is no such rule called regex. If you include the additional-methods.js file, then you can use the pattern method in its place.

  3. You are missing a comma after the rules option...

    rules: {
        persname: {
            required: true,
            pattern: /^[A-Za-z]+$/  // <- use 'pattern' in place of "regex"
        }
    }, // <- need a comma here
    submitHandler: function() {                        
        alert("alert");
    }
    

DEMO: http://jsfiddle.net/c6L3Loot/

Comments

0

You have error in your <head> section.

You are including this:

<script src="http://http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>

Which is wrong. Try this:

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.