背景
在使用maven架构SSM+shiro框架的开发过程中,页面使用bootstrapvalidator插件作为验证插件@varsion0.5.3,发现remote和threshold不是那么好用,到处百度、Google都没有很满意的结果,经过一番纠结之后终于解决问题了,在这里记录一下,以备以后查阅。
准备工作
<!--bootstrap 3.4.1-->
<link rel="stylesheet" href="${pageContext.request.contextPath}/lib/bootstrap/css/bootstrap.min.css">
<!-- 表单验证CSS-->
<link rel="stylesheet" href="${pageContext.request.contextPath}/lib/bootstrapvalidator/bootstrapValidator.min.css">
-------------------------------------------------------------------------------------------------------------
<!-- jQuery 1.12.4 需要jquery 1.9.1以上版本-->
<script src="${pageContext.request.contextPath}/js/jquery-1.12.4.min.js"></script>
<!-- Bootstrap 3.4.1 -->
<script src="${pageContext.request.contextPath}/lib/bootstrap/js/bootstrap.min.js"></script>
<!-- 表单验证JSS-->
<script type="text/javascript"
src="${pageContext.request.contextPath}/lib/bootstrapvalidator/bootstrapValidator.min.js"></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/lib/bootstrapvalidator/language/zh_CN.js"></script>
html页面
<div class="form-group">
<label>用户名</label>
<input type="text" class="form-control" name="username" placeholder="请输入用户的登录名">
</div>
JS代码
threshold
<!--
threshold必须和message、 validators同一级才会生效
-->
username: {
message: '用户名验证失败',
threshold: 2,
validators: {
...省略代码
}
remote
notEmpty: {
message: '用户名不能为空'
},
regexp: {
regexp: /^[a-zA-Z0-9_]+$/,
message: '用户名只能包含大写、小写、数字和下划线'
},
remote: {
url: '${pageContext.request.contextPath}/user/checkUserIsExist',
message: '用户名已存在,请重新输入',
type: 'GET',
delay: 1000
}
}
Controller实现
/**
* 功能描述:
* 返回String类型的结果
* 检查用户名的合法性,如果用户已存在,返回false,否则返回true
* 返回json数据,格式为{"valid",true}
*
* @Param: [username]
* @Return: java.lang.String
* @Author: cyikns
* @Date: 2019/5/30 16:50
*/
@RequestMapping(value = "/checkUserIsExist", produces = "application/json;charset=UTF-8")
@RequiresPermissions("user:query")
@ResponseBody
public Map<String, Boolean> checkUserIsExist(String username) {
HashMap<String, Boolean> map = new HashMap<>();
try {
if (!StringUtils.isEmpty(username)) {
username = username.trim().toLowerCase();
System.out.println(username);
}
User user = userService.findUserByUsername(username);
System.out.println(user);
if (user == null) {
map.put("valid", true);
} else {
map.put("valid", false);
}
} catch (Exception e) {
e.printStackTrace();
}
return map;
}