- 首页 > 睿知 > it技术 > >
前端|bootstrapvalidator表单验证、验证清除重置
javascript前端bootstrap
// 初始化表单验证
$(function () {
formValidator();
});
// Modal验证销毁重构
$('#add').on('hidden.bs.modal', function () {
$("#formValidate").data('bootstrapValidator').destroy();
$('#formValidate').data('bootstrapValidator', null);
formValidator();
});
// 表单验证
function formValidator() {
$('#formValidate').bootstrapValidator({
message: 'This value is not valid',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
hostname: {
validators: {
notEmpty: {
message: '主机名称不能为空'
},
regexp: {
// regexp: /([a-z0-9_-]{1,32}\.)+([a-z0-9_-]{1,32})((\.[a-z]{2,4})(.[a-z]{1,2})?)/,xxx.xxx.xxx
regexp: /([a-z0-9_-]{1,32})((\.[a-z]{2,4})(.[a-z]{1,2})?)/,//xxx.xxx
message: '主机名称格式不正确'
}
}
},
ip: {
validators: {
notEmpty: {
message: 'IP不能为空'
},
regexp: {
regexp: /(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}/,
// regexp: /^(([01]?[0-9]?[0-9]|2([0-4][0-9]|5[0-5]))\.){3}([01]?[0-9]?[0-9]|2([0-4][0-9]|5[0-5]))$/,
message: 'IP格式不正确'
}
}
}
}
})
}
//新增 编辑
function saveTractor() {
var bootstrapValidator = $("#formValidate").data('bootstrapValidator');
bootstrapValidator.validate();
if (bootstrapValidator.isValid()) {
var name = $("#hostname").val();
var ip = $("#ip").val();
var id = $("#tractorId").val();
if (id == '' || id == undefined) {
var tractorData = https://www.it610.com/article/{"name": name,
"ip": ip,
"state": 0
}
} else {
var tractorData = https://www.it610.com/article/{"id": id,
"name": name,
"ip": ip,
"state": 0
}
}
$.ajax({
type: "post",
url: "/api/tractor/edit",
beforeSend: function (request) {
request.setRequestHeader("Authorization", localStorage.getItem("token"));
},
contentType: "application/json",
data: JSON.stringify(tractorData),
success: function (result) {
if (result.code == 200) {
$("#add").modal("hide");
pageSearch();
$('#alertSuccess').removeClass('hide').addClass('in')
window.setTimeout(function () {
$('#alertSuccess').removeClass('in').addClass('hide')
}, 2000);
} else {
$("#add").modal("hide");
$('#alertDanger').removeClass('hide').addClass('in')
window.setTimeout(function () {
$('#alertDanger').removeClass('in').addClass('hide')
}, 2000);
}
}
})
} else {
return;
}}
推荐阅读
