为什么这个表单验证与jquery不起作用?

时间:2013-09-13 10:55:37

标签: jquery jquery-validate

我无法使用jquery验证简单的HTML表单。请帮忙。以下是我的代码。

请注意我对jquery很新,所以这可能是一个愚蠢的问题。任何帮助将不胜感激

<script type="text/javascript">
  function validate(){

    alert("1");

     $("#form1").validate({

     rules: { 
         name: "required", 
         age: "required", 
         id: "required", 
    },
    messages: {
        name: " Enter username", 
        age: " Enter age",
        id: " Enter id",

      },
      submitHandler: function(form) {
          alert('3');
            form.submit();

      }

   });     
  }; 
  </script>
  <title>Spring MVC Form Handling</title>
  </head>
  <body>

  <h2></h2>
  <form method="POST" action="addStudent.do" id=form1>
  <div id="form-content">
    <fieldset>
  <div class="fieldgroup">

      <label for="name">First Name</label> 
      <input type="text"  id="name">
  </div>

  <div class="fieldgroup">   
    <label for="age">Age</label>
    <input type="text"  id="age">
  </div>   

 <div class="fieldgroup"> 
   <label for="id">Id</label>
   <input type="text" id="id">
 </div> 

    <div class="fieldgroup">

             <input type="submit" value="Register" id="submit" class="submit"    onclick="validate()">  
    </div>

   </fieldset>
    </div>
  </form>


  </body>

2 个答案:

答案 0 :(得分:0)

试试这个

<script>
       $.validator.setDefaults({
            submitHandler: function() { alert("submitted!"); }
        });

        $(document).ready(function() {

           $("#form1").validate({

            rules: { 
             name: "required", 
             age: "required", 
             id: "required", 
           },
            messages: {
            name: " Enter username", 
            age: " Enter age",
            id: " Enter id",

           }        
       });    

      }
</script>



<input type="text" name="name" id="name">
 <input type="text" name="age" id="age">
 <input type="text" name="id" id="id">
<input type="submit" value="Register" id="submit" class="submit"> 

答案 1 :(得分:0)

尝试将表单更改为

<form id="Form1" method="POST" action="addStudent.do">
.
.
.

复制并粘贴它,你会看到它正在运行!