一、Bootstrap-Validator验证插件
下载:
http://bootstrapvalidator.votintsev.ru/getting-started/
教程:
https://www.cnblogs.com/landeanfen/p/5035608.html
https://www.cnblogs.com/mzqworld/articles/9068430.html
引入插件
<!--引入验证插件的样式文件-->
<link rel="stylesheet" href="/js/plugins/bootstrap-validator/css/bootstrapValidator.min.css"/>
<!--引入验证插件的js文件-->
<script type="text/javascript" src="/js/plugins/bootstrap-validator/js/bootstrapValidator.min.js"></script>
<!--中文语言库-->
<script type="text/javascript" src="/js/plugins/bootstrap-validator/js/language/zh_CN.js"></script>
模板
<script>
$(function () {
// 表单验证配置
$("#editForm").bootstrapValidator({
feedbackIcons: { //图标
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields:{ // 配置不同的输入框
<#--<#if !employee??>-->
name:{ // 按照name来找的
validators: { // 验证的规则
notEmpty: { // notEmpty(必填) 规则的名字 是规定的
message: '不能为空!' // 错误时的提示信息
},
remote: {
type: 'POST',
url: '/employee/checkName.do',
message: '用户名已存在!',
delay: 1000 ,
data: function() { // 自定义提交参数,默认只会提交当前用户名input的参数
return {
id: $('[name="id"]').val(),
name: $('[name="name"]').val()
};
}
}
}
},
<#--</#if>-->
password:{
validators:{
notEmpty:{ //不能为空
message:"密码必填" //错误时的提示信息
},
stringLength: { //字符串的长度范围
min: 1,
max: 5
}
}
},
repassword:{
validators:{
notEmpty:{ //不能为空
message:"密码必填" //错误时的提示信息
},
identical: {//两个字段的值必须相同
field: 'password',
message: '两次输入的密码必须相同'
}
}
},
email: {
validators: {
emailAddress: {} //邮箱格式
}
},
age:{
validators: {
between: { //数字的范围
min: 18,
max: 60
}
}
}
}
}).on('success.form.bv', function() { // 点击事件=>表单所有数据验证通过后=>执行里面的代码
// 不能用提交的方法,会重复的验证表单,死循环
// $("#editForm").submit(); // 调用提交表单的方法,验证插件就会验证
// 做自定义的验证
// 马上提交异步请求
$("#editForm").ajaxSubmit(function (data) {
if(data.success){ // 成功
$.messager.alert("成功,2秒后刷新");
setTimeout(function () {
window.location.href = "/employee/list.do";
},2000)
}else{
alert(data.msg);
}
})
});
})
</script>
后台处理
/**
* 插件要求返回 valid:false(验证不通过) valid:true(验证通过)
* @param name
* @return
*/
@RequestMapping("/checkName")
@ResponseBody
public HashMap<String, Boolean> checkName(String name, Long id) {
HashMap<String, Boolean> map = new HashMap<>();
Employee employeeByName = employeeService.selectByName(name);
// id不为空,为修改页面
if (id != null) {
Employee employeeById = employeeService.get(id);
// 验证是否修改了 name 值(判断当前验证的 name 值与根据 id 查询的name是否匹配)
if(name.equals(employeeById.getName())){
map.put("valid", true); // 相同没修改,验证通过
return map;
}else { // 不同修改了,进行验证
map.put("valid", employeeByName == null);
return map;
}
}
// 注意:valid 为插件提供的,不能自定义
map.put("valid", employeeByName == null);
return map;
}
二、统一异常处理
- Spring MVC 的方式
定义一个工具类
ContrllerExceptionHandler.java
**
* 对控制器进行处理
* 利用aop
*/
// mvc.xml 的扫描控制器 上一定要扫到
@ControllerAdvice
public class ContrllerExceptionHandler {
/**
* 当前的方法用于捕获指定的异常
*/
@ExceptionHandler(RuntimeException.class) // 规定为运行时异常
public String handler(RuntimeException e, HttpServletResponse response, HandlerMethod handlerMethod) throws IOException {
// 打印错误信息方便debug
e.printStackTrace();
// 判断如果是ajax对应的方法(判断有没有ResponseBody注解),有就返回JsonResult
if(handlerMethod.hasMethodAnnotation(ResponseBody.class)){
response.setContentType("application/json;charset=utf-8"); // 为了适配浏览器,显式的告诉浏览器数据类型和编码方式
response.getWriter().print(JSON.toJSONString(new JsonResult(false, "操作失败")));
return null;
}else {
// 如果不是,就返回错误的视图页面
return "common/error";
}
}
}
网友评论