title: ASP MVC4+JQuery validation doesn't work
body: <p>I've follow the steps in the Internet to set up the validation for the password. </p>
  
  <p>I'm using ASP.NET MVC4+razor+jquery, but the validation seems not work.Here are my codes:</p>
  
  <p>CSHTML:</p>
  
  <pre><code>@using (Html.BeginForm("Index","Home",FormMethod.Post,new { id="resetForm"}))
  {
  
      &lt;ol class="round"&gt;
      &lt;li class="one"&gt;
          &lt;h5&gt;Select the Application.&lt;/h5&gt;
          @model PWDManagementCenter.Models.UserApplicationModels
  
          @Html.DropDownListFor(x =&gt; x.selectedUserApp, Model.userApps)
      &lt;/li&gt;
  
      &lt;li class="two"&gt;
          &lt;h5&gt;Input Login ID of Application&lt;/h5&gt;
          &lt;input name="txtLogonId"   /&gt;
      &lt;/li&gt;
  
      &lt;li class="three"&gt;
          &lt;h5&gt;Input the new password&lt;/h5&gt;
          &lt;input id="txtPwd" name="txtPwd" type="password" /&gt;
          &lt;h6&gt;Retype the password&lt;/h6&gt;
          &lt;input id="txtPwd2" name="txtPwd2" type="password" /&gt;&lt;p /&gt;
          &lt;input id="btnSubmit" type="submit" value="Save" /&gt;
      &lt;/li&gt;
  &lt;/ol&gt;
  }
  </code></pre>
  
  <p>JS in html:</p>
  
  <pre><code>&lt;script src="/Scripts/jquery-1.7.1.js" type="text/javascript" /&gt;
  &lt;script src="/Scripts/jquery.validate.js" type="text/javascript" /&gt;
  &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $('#resetForm').validate({
              rules: {
                  txtPwd: {
                      require: true, minlength: 6, maxlength: 20
                  },
                  txtPwd2: {
                      require: true, equalTo: '#txtPwd', minlength: 6, maxlegth: 20
                  }
              },
              messages: {
                  txtPwd: {
                      require: "Password is required!",
                      minlength: "Password contains at least 6 characters",
                      maxlength: "Password contains at most 20 characters"
                  },
                  txtPwd2: {
                      equalTo: "Make sure input the same password as above"
                  }
              }
          });
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>And the controller:</p>
  
  <pre><code>[HttpPost]
          public ActionResult Index(UserApplicationModels model)
          {
              string appName = model.selectedUserApp;
              string id = Request.Form["txtLogonId"];
              string newPwd = Request.Form["txtPwd"];
              string newPwd2 = Request.Form["txtPwd2"];
  
              ......
          }
  </code></pre>
  
  <p>When I click the submit button in debug mode, it jump to this Index function without validation.</p>
  
  <p>Why? Anything I missed? Please help.</p>
  
  <p>I follow this simple validation <a href="http://alittlecode.com/files/jQuery-Validate-Demo/" rel="nofollow">demo</a> </p>
  
  <p>Thanks to those who answered the question. You gave me the hits to solve the problem.</p>
  
  <ol>
  <li><p>The script tab should end with "<code>&lt;/script&gt;</code>" rather than " <code>/&gt;</code> "
  So this "<code>&lt;script src="/Scripts/jquery.validate.js" type="text/javascript" /&gt;</code>" can't work
  but this "<code>&lt;script src="/Scripts/jquery.validate.js" type="text/javascript" &gt;&lt;/script&gt;</code>" works</p></li>
  <li><p>After 1, I got an runtime error, saying that "jscript runtime error object doesn't support this property or method"
  This is because we include jquery twice.</p></li>
  </ol>
  
  <p>After 1,2 , validation is normal.</p>