BootstrapValidator 验证 Remote 远程验证使用

avatar 2018年3月21日15:22:16 评论 1,762 views

在使用 BootstrapValidator 做前台表单验证的时候,在验证用户名是否存在的时候,一直无效,主要是两个问题。

 

1、传参

传参不能再 URL 上传参

即  url: '/ajax/checkUsername/'+$("#username").val(),  这种写法是不可以的

 

其实系统会默认将该字段的值传入后台

所以这样就行

data : '',//这里默认会传递该验证字段的值到后端

如果要传其他参数也可以使用 function 方法

 data:{                 
    username:function(){return $("#username").val()},  
},

 

2、JSON 返回格式

后台返回给前台的 JSON 格式必须是

{
     valid:true或false;
}

 

之前一直返回 true 和 false 是不行的。

 

最终代码如下

前台代码

  1. username: {
  2.     message: '用户名不合法',
  3.     validators: {
  4.         notEmpty: {
  5.             message: '用户名不能为空'
  6.         },
  7.         stringLength: {
  8.             min: 4,
  9.             max: 20,
  10.             message: '用户名为420个字符'
  11.         },
  12.         regexp: {
  13.             regexp: /^[a-zA-Z0-9_.@]+$/,
  14.             message: '用户名只能由字母、数字和下划线组成'
  15.         },
  16.         remote: {
  17.             type:"POST",
  18.             message: '用户名已经存在',
  19.             url: '/ajax/checkUsername',
  20.             data : '',//这里默认会传递该验证字段的值到后端,
  21.             delay: 2000,//每输入一个字符,就发ajax请求,服务器压力还是太大,设置2秒发送一次ajax(默认输入一个字符,提交一次,服务器压力太大)
  22.         }
  23.     }

 

后台代码

  1. @PostMapping("/ajax/checkUsername")
  2.  @ResponseBody
  3.  public String checkUsername(String username) {
  4.      HashMap<String,Boolean> hashMap = new HashMap();
  5.      User user = userService.getUserByUsername(username);
  6.      //可用
  7.      if (user == null) {
  8.          hashMap.put("valid",true);
  9.      } else {
  10.          hashMap.put("valid",false);
  11.      }
  12.      return JSON.toJSONString(hashMap);
  13.  }

历史上的今天
三月
21
  • 微信
  • 交流学习,有偿服务
  • weinxin
  • 博客/Java交流群
  • 资源分享,问题解决,技术交流。群号:590480292
  • weinxin
avatar

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: