关于bootstrapValidator 表单校验remote出现两次重复提交才能验证通过问题处理
使用bootstrapValidator插件校验编号,姓名唯一性,发现该插件在使用remote属性出现两次点击提交按钮才能通过验证。
原因:remote里面请求后台默认是异步请求的,而且还不能同步请求,bootstrapValidator没有等ajax拿到返回值就直接拿了一个默认值false导致的该问题;
在网上看了很多文章都没有正确的解决方法,已下是我的处理方式:
使用callback属性代替remote属性实现灵活的请求校验。
平常的写法:
name : {
group : '.col-sm-6',
validators : {
notEmpty : {
message : '请填写名称'
},
stringLength: {
max: 45,
message: '输入长度不得超过45位'
},
remote : {
url: aicDb + 'categoryCodeAction!checkExists.action',
message:'已存在',
type: 'post',
data:function(validator) {
return {
usetype: $('#usetype').val(),
id:$('#elementID').val()
};
}
}
}
},
修改后的代码
name : {
group : '.col-sm-6',
validators : {
notEmpty : {
message : '请填写名称'
},
stringLength: {
max: 45,
message: '输入长度不得超过45位'
},
callback: {
message: '已存在',
callback: function (value, validator) {
console.log(value);
var flag = false;
$.ajax({
url:aicDb + 'categoryCodeAction!checkExists.action', // 请求路径
type:'POST',
async:false, // 同步请求,必须是false
data: {
name: value,
usetype: $('#usetype').val(),
id:$('#elementID').val()
},
success:function(res){
flag = res.valid;
}
});
return flag
}
},
}
},
将remote改为callback中即可
注意: 此处callback 的 async必须是同步的
async:false, // 同步请求,必须是false

浙公网安备 33010602011771号