提交审核
我这边没有使用表单提交验证,而已点击button按钮,Ajax提交,注意一下。
js:
$(function(){/* 文档加载,执行一个函数*/
// $(".submit_review").attr({"disabled":"disabled"});
$('#defaultForm').bootstrapValidator({
message: 'This value is not valid',
feedbackIcons: {/*输入框不同状态,显示图片的样式*/
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {/*验证*/
company_name: {/*键名username和input name值对应*/
validators: {
notEmpty: {/*非空提示*/
message: '公司名称不能为空'
},
// stringLength: {/*长度提示*/
// min: 6,
// max: 30,
// message: '用户名在6到30之间'
// }/*最后一个没有逗号*/
}
},
company_id: {
validators: {
notEmpty: {
message: '公司ID不能为空'
},
}
},
equipment_ip: {
validators: {
notEmpty: {
message: '设备IP不能为空'
},
regexp: {
regexp: /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/,
message: '设备IP不合法'
}
}
},
}
})
});
$("#btn_reset").click(function(event) {
/* Act on the event */
$('#defaultForm').data('bootstrapValidator').resetForm(true);
});
$("body").on('click', '#btn_submit_add', function(event) {
/* Act on the event */
$('#defaultForm').bootstrapValidator('validate');
var flag = $("#defaultForm").data('bootstrapValidator').isValid();
if (!flag) {
toastr.error("填写有误,请重新填写!");
} else {
$.post('addEquipmentInfoCheck.action', {
"equipmentInfoCheck.companyId": $("#company_id").val(),
"equipmentInfoCheck.companyName": $("#company_name").val(),
"equipmentInfoCheck.machineRoom": $("#computer_room").val(),
"equipmentInfoCheck.equipmentCabinet": $("#cabinet").val(),
"equipmentInfoCheck.deviceType": $("#equipment_type").val(),
"equipmentInfoCheck.deviceName": $("#equipment_name").val(),
"equipmentInfoCheck.deviceIp": $("#equipment_ip").val(),
"equipmentInfoCheck.deviceBrand": $("#equipment_brand").val(),
"equipmentInfoCheck.deviceModel": $("#equipment_model").val(),
"equipmentInfoCheck.position": $("#shelf_position").val(),
"equipmentInfoCheck.deviceSn": $("#equipment_sn").val(),
"equipmentInfoCheck.devicePn": $("#equipment_pn").val(),
"equipmentInfoCheck.state":1
}, function(data, textStatus, xhr) {
/*optional stuff to do after success */
if (textStatus == "success") {
// e.preventDefault();
$('#defaultForm').data('bootstrapValidator').resetForm(true);
$("#myModal_add").modal('hide');
toastr.success("提交成功");
}else{
$("#myModal_add").modal('hide');
toastr.error("提交失败");
}
});
}
});
OK,至此模态框验证,提交就完成了~
下面附上原始js校验:
$("#equipment_ip").blur(function(){
var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/ ;
var flag=reg.test($(this).val());
if(!flag){
toastr.error("IP不合法,请重新输入");
$(this).val("");
}
);
以上是“bootstrap+Validator如何实现模态框、jsp、表单验证 Ajax提交功能”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!
新闻标题:bootstrap+Validator如何实现模态框、jsp、表单验证Ajax提交功能
文章转载:http://pcwzsj.com/article/gegpjg.html