bootstrapform表单重置_bootstrapvalidator表单验证、验证清除重置

本文介绍如何在Bootstrap环境下实现表单验证、清除和重置功能。通过示例代码展示了如何初始化表单验证,以及在Modal关闭时销毁并重新构建验证。同时,详细说明了主机名和IP地址字段的正则表达式验证规则,确保输入格式正确。
摘要由CSDN通过智能技术生成

// 初始化表单验证

$(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 = {

"name": name,

"ip": ip,

"state": 0

}

} else {

var tractorData = {

"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;

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值