自定义validate的效验规则

Posted 2020-11-21 benjamin77

 

 

<script type="text/javascript">
    //自定义效验规则
    $.validator.addMethod(
        //规则名称
        "checkUsername",
        function (value,element,params) {

            //定义一个标志
            var flag=false;


            //value:输入的内容
            //element：被效验的元素对象
            //params：规则对应的参数值
            //目的：对输入的username进行ajax效验
            $.ajax({
                "async":false,
                "url":"${pageContext.request.contextPath}/check",
                "data":{"username":value},
                "type":"POST",
                "dataType":"json",
                "success":function (data) {
                    flag=data.isExist;

                }
            });

            //如果false代表该效验不通过
            return !flag;
        }

    )


    $(function(){
        $("#myform").validate({
            rules:{
                "username":{
                    "required":true,
                    "checkUsername":true
                }
　　　　　　}，

　　　　　　　　messages:{
　　　　　　　　　　"username":{
　　　　　　　　　　"required":"用户名不能为空",
　　　　　　　　　　"checkUsername":"用户名已存在"
　　　　　　　},

})
});
</script>

后端需要将servlet获取到的输入值 封装成json响应给前端

 String username=request.getParameter("username");
        UserService service=new UserService();
        boolean isExist=service.checkUsername(username); //这个isExist是从后端数据库返回过来的

        String json="{"isExist":"+isExist+"}";
        response.getWriter().write(json);