验证不适用于spring提交请求

时间:2017-09-03 12:05:03

标签: jquery jsp jquery-validate spring-form

我是jquery的新手,我正在尝试弹簧验证,但我无法看到提交请求的任何验证。请帮我理解这个问题。

<form:form id="signupForm" modelAttribute="login" action="/loginUser" method="post" class="form-signin" >
   <table align="center">
      <tr> <td>
         <form:input path="username" name="username" id="username" placeholder="Username" class="form-control"/>
       </td></tr>
       <tr><td>
        <form:password path="password" name="password" id="password" placeholder="password" class="form-control" />
        </td></tr>
        <tr><td>
         <form:button class="btn btn-lg btn-primary btn-block btn-signin" type="submit">Sign in</form:button>
         </td></tr>
    </table>
</form:form>

我在jsp:

的head部分添加了脚本文件
<script type="text/javascript">
 $(document).ready(function() {
     $("#signupForm").validate({
         rules: {
            username: {
               required: true,
               minlength: 2
            },
            password: {
                required: true,
                minlength: 5
            }
          },
          messages: {
              username: {
                    required: "Please enter a username",
                    minlength: "Your username must consist of at least 2 characters"
              },
              password: {
                    required: "Please provide a password",
                    minlength: "Your password must be at least 5 characters long"
             }
       }
  });
</script>

还将其导入我的jsp文件:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.min.js"></script>

1 个答案:

答案 0 :(得分:1)

我可以在没有弹簧类型输入的情况下执行代码。您在脚本末尾错过了});。请查看更正后的HTML代码,

<form id="signupForm" action="/loginUser" method="post" class="form-signin" >
<table align="center">
  <tr> <td>
     <input name="username" id="username" placeholder="Username" class="form-control"/>
   </td></tr>
   <tr><td>
    <input type="password" name="password" id="password" placeholder="password" class="form-control" />
    </td></tr>
    <tr><td>
     <button class="btn btn-lg btn-primary btn-block btn-signin" type="submit">Sign in</button>
     </td></tr>
</table>
</form>

脚本,

$(document).ready(function() {
 $("#signupForm").validate({
     rules: {
        username: {
           required: true,
           minlength: 2
        },
        password: {
            required: true,
            minlength: 5
        }
      },
      messages: {
          username: {
                required: "Please enter a username",
                minlength: "Your username must consist of at least 2 characters"
          },
          password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 5 characters long"
          }
       }
   })
});

Validation Image

请找到此代码的Working Demo。如果这有帮助,请告诉我。

干杯..!