BootstrapValidator官方下载地址：
https://codeload.github.com/nghuuphuoc/bootstrapvalidator/zip/v0.4.5
BootstrapValidator 表单选择性数据验证方法示例代码：
<!DOCTYPE html>
<html>
<head>
<title>BootstrapValidator 表单选择性数据验证方法</title>
<link rel="stylesheet" href="../vendor/bootstrap/css/bootstrap.css"/>
<link rel="stylesheet" href="../dist/css/bootstrapValidator.css"/>
<script type="text/javascript" src="../vendor/jquery/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="../vendor/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../dist/js/bootstrapValidator.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<section>
<div class="col-lg-8 col-lg-offset-2">
<div class="page-header">
<h2>BootstrapValidator 表单选择性数据验证方法</h2>
</div>
<form id="paymentForm" method="post" class="form-horizontal" action="target.php">
<div class="form-group">
<label class="col-lg-3 control-label">填写的数字</label>
<div class="col-lg-5">
<input type="text" class="form-control" id="cardHolder" />
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">选判断项（如果上面填写的数字为3则不验证此项有效性）</label>
<div class="col-lg-2">
<input type="text" id="cvv" class="form-control cvvNumber" name="cvv" />
</div>
</div>
<div class="form-group">
<div class="col-lg-9 col-lg-offset-3">
<button type="submit" class="btn btn-primary">提交</button>
</div>
</div>
</form>
</div>
</section>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$('#paymentForm').bootstrapValidator({
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
cardHolder: {
selector: '#cardHolder',
validators: {
/*callback: {
callback: function(value, validator, $field) {
field_name = $($field).attr('value');
//alert(value);
$('#cvv').removeAttr("cvvNumber");
$('#paymentForm')
.bootstrapValidator('resetField', $('#cvv') )
.bootstrapValidator('updateStatus', $('#cvv') , 'NOT_VALIDATED')
;
return true;
}
},*/
notEmpty: {
message: 'The card holder is required'
},
stringCase: {
message: 'The card holder must contain upper case characters only',
case: 'upper'
}
}
},
cvvNumber: {
selector: '.cvvNumber',
validators: {
callback: {
callback: function(value, validator, $field) {
if($("#cardHolder").val()=='3'){
field_name = $($field).attr('value');
$('#paymentForm')
.bootstrapValidator('resetField', field_name )
.bootstrapValidator('updateStatus', field_name, 'NOT_VALIDATED')
;
return true;
}
}
},
notEmpty: {
message: 'The CVV number is required'
},
cvv: {
message: 'The value is not a valid CVV',
creditCardField: 'ccNumber'
}
}
}
}
});
});
</script>
</body>
</html>
开心洋葱 , 版权所有丨如未注明 , 均为原创丨未经授权请勿修改 , 转载请注明BootstrapValidator 表单选择性数据验证方法！
