BootStrap表单验证用户名重复

html:

1 <div class="form-group">
2                 <label for="username" class="control-label col-md-3 col-sm-4">账号</label>
3                 <div class="col-md-9 col-sm-8">
4                     <div class="input-group">
5                         <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
6                         <input type="text" class="form-control" id="username" name="username" placeholder="请输入昵称"/>
7                     </div>
8                 </div>
9             </div>

js:

 1 <script type="text/javascript">
 2     $(function () {
 3         //alert(123)
 4         $("#regist_form").bootstrapValidator({
 5             live: 'enabled', //验证时机，enabled是内容有变化就验证（默认），disabled和submitted是提交再验证
 6             excluded: [':disabled', ':hidden', ':not(:visible)', ':file'], //排除无需验证的控件，比如被禁用的或者被隐藏的
 7             submitButtons: '#reg-btn', //指定提交按钮，如果验证失败则变成disabled，按钮变灰色
 8             message: '通用的验证失败消息', //好像从来没出现过
 9             feedbackIcons: { //根据验证结果显示的各种图标
10                 valid: 'glyphicon glyphicon-ok',
11                 invalid: 'glyphicon glyphicon-remove', //小叉号
12                 validating: 'glyphicon glyphicon-refresh'
13             },
14             fields: {
15                 username: {
16                     verbose: false, //代表验证按顺序验证。验证成功才会下一个（验证成功才会发最后一个remote远程验证）
17                     validators: {
18                         notEmpty: {
19                             message: '账号不能为空'
20                         },
21                         stringLength: {
22                             min: 6,
23                             max: 30,
24                             message: '账号长度必须在6到30之间'
25                         },
26                         threshold: 6,//有6字符以上才发送ajax请求
27 
28                         remote: { //ajax验证。server result:{"valid",true or false} （返回前台类型）
29                             url: "stu-exist",
30                             message: '用户名已存在,请重新输入',
31                             delay: 500, //ajax刷新的时间是0.5秒一次
32                             type: 'POST',
33                             //自定义提交数据，默认值提交当前input value
34                             /*data: function (validator) {
35                                 return {
36                                     userName: $("input[name=userName]").val(),
37                                     //method: "stuIsExist" //UserServlet判断调用方法关键字。
38 
39                                 };
40                             }*/
41                         },
42                     }
43                 },
44             }
45 
46         });
47     })
48 </script>

StuService:

1 //验证账号是否存在（用户注册）
2 Boolean stuIsExist(String username);

StuServiceImpl:

 1     /**
 2      * @Description //验证账号是否存在
 3      * @Date 2019-04-01 17:39
 4      * @Param [username]
 5      * @return java.lang.Boolean
 6      **/
 7     @Override
 8     public Boolean stuIsExist(String username) {
 9 
10         UserExample userExample = new UserExample();
11         UserExample.Criteria criteria = userExample.createCriteria();
12         criteria.andUsernameEqualTo(username);
13         List<User> userList = userMapper.selectByExample(userExample);
14         if (userList.isEmpty()) {
15             return true;
16         } else {
17             return false;
18         }
19 
20     }

RegisterController.java：

 1     /**
 2      * @Description //验证账号是否存在
 3      * @Date 2019-04-01 17:43
 4      * @Param [username]
 5      * @return java.util.Map<java.lang.String,java.lang.Boolean>
 6      **/
 7     @PostMapping("stu-exist")
 8     @ResponseBody
 9     public Map<String,Boolean> stuIsExist(String username){
10         Boolean stuIsExist = stuService.stuIsExist(username);
11         Map<String,Boolean> map = new HashMap<String,Boolean>();
12 
13         //map.put("valid",true);
14         if (stuIsExist){
15             map.put("valid",true);
16         }else {
17             map.put("valid",false);
18         }
19 
20         System.out.println(username+map);
21         return map;
22     }

 

原文地址：https://www.cnblogs.com/116970u/p/10638432.html