- 官方地址
貌似要钱,不过在天朝。。。
- 使用方法:引入 JS CSS 本地化文件JS
<html>
<head>
<link rel="stylesheet" href="/vendors/formvalidation/dist/css/formValidation.min.css">
</head>
<body>
<!-- 你的表单写在这里 -->
...
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.3/es6-shim.min.js"></script>
<script src="/vendors/formvalidation/dist/js/FormValidation.min.js"></script>
</body>
</html>
js验证表单
$('#formId').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
fieldName: {
validators: {
notEmpty: {
message: '请输入XXXX'
}
}
},
fieldName: {
validators: {
notEmpty: {
message: '这里是验证失败的提示信息'
}
}
}
}
}).on('success.form.fv', function (e) {
// Prevent form submission 阻止默认的submit方法,用ajax提交
e.preventDefault();
// Some instances you can use are
var $form = $(e.target), // The form instance
fv = $(e.target).data('formValidation'); // FormValidation instance
// Do whatever you want here ...
$.ajax({
url: '这里是你要提交的URL',
method: 'POST',
dataType: 'json',
data: $form.serialize(),
error: function (jqXHR, textStatus, e) {
alertWarn('服务器正忙');
},
success: function (data) {
if (data.result_code == 0) {
alertSuccess('保存成功');
$('#myModal').modal('hide');
$('#table-all').bootstrapTable('refresh', {
silent: true
});
}
}
});
});
- 手动清除验证
$('#formId').data('formValidation').resetForm();
- 待补充
正则表达式验证
远程验证