利用jquery.validate异步验证值是否存在步骤
引入相关JS
<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script> <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script> <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
2.
$.validator.setDefaults({ submitHandler: function() { //提交表单操作 } }); $().ready(function() { $("#commentForm").validate({ rules: { collegeNo: { required: true, remote: { type: "post", url: "${ctx}/test-college!AJAXCheckCollegeNo.action", async:false, data: { username: function() { return $("#collegeNo").val(); } } } }, }, messages: { collegeNo: { required:"请输入学院编号", remote:"学院编号已经存在" } } }) });
3.html代码
<input type="text" id="collegeNo" name="collegeNo" />
后台代码:
/** * 验证学院编号是否存在 */ public void AJAXCheckCollegeNo(){ HttpServletRequest request = ServletActionContext.getRequest(); HttpServletResponse response = ServletActionContext.getResponse(); try { String parameter = request.getParameter("collegeNo"); System.out.println(parameter); List<TestCollege> byColums = testCollegeService.getByColums("collegeNo", parameter); if (byColums!=null && byColums.size()>0) { response.getWriter().write("false"); }else{ response.getWriter().write("true"); } } catch (Exception e) { e.printStackTrace(); try { response.getWriter().write(0); } catch (IOException e1) { e1.printStackTrace(); } } }
注意事项:
ajax后台验证输出只能输出 “true” 或者 “false”
微信扫码关注DEMO程序园公众号