|
|
@@ -19,8 +19,14 @@
|
|
|
|
|
|
this.invalidField = null; // First invalid field
|
|
|
this.$submitButton = null; // The submit button which is clicked to submit form
|
|
|
+ this.formSubmitted = false; // Flag to indicate the form is submitted or not
|
|
|
|
|
|
this._init();
|
|
|
+
|
|
|
+ this.STATUS_NOT_VALIDATED = 'NOT_VALIDATED';
|
|
|
+ this.STATUS_VALIDATING = 'VALIDATING';
|
|
|
+ this.STATUS_INVALID = 'INVALID';
|
|
|
+ this.STATUS_VALID = 'VALID';
|
|
|
};
|
|
|
|
|
|
// The default options
|
|
|
@@ -42,7 +48,7 @@
|
|
|
feedbackIcons: false,
|
|
|
|
|
|
// The submit buttons selector
|
|
|
- // These buttons will be disabled when the form input are invalid
|
|
|
+ // These buttons will be disabled to prevent the valid form from multiple submissions
|
|
|
submitButtons: 'button[type="submit"]',
|
|
|
|
|
|
// The custom submit handler
|
|
|
@@ -84,14 +90,13 @@
|
|
|
// Disable the default submission first
|
|
|
.on('submit.bootstrapValidator', function(e) {
|
|
|
e.preventDefault();
|
|
|
+ that.formSubmitted = true;
|
|
|
that.validate();
|
|
|
- });
|
|
|
-
|
|
|
- this.$form
|
|
|
+ })
|
|
|
.find(this.options.submitButtons)
|
|
|
- .on('click', function() {
|
|
|
- that.$submitButton = $(this);
|
|
|
- });
|
|
|
+ .on('click', function() {
|
|
|
+ that.$submitButton = $(this);
|
|
|
+ });
|
|
|
|
|
|
for (var field in this.options.fields) {
|
|
|
this._initField(field);
|
|
|
@@ -161,7 +166,7 @@
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
- this.results[field][validatorName] = null;
|
|
|
+ this.results[field][validatorName] = this.STATUS_NOT_VALIDATED;
|
|
|
$('<small/>')
|
|
|
.css('display', 'none')
|
|
|
.attr('data-bs-validator', validatorName)
|
|
|
@@ -197,6 +202,10 @@
|
|
|
event = ('radio' == type || 'checkbox' == type || 'SELECT' == fields[0].tagName) ? 'change' : 'keyup';
|
|
|
|
|
|
fields.on(event, function() {
|
|
|
+ // Whenever the user change the field value, make it as not validated yet
|
|
|
+ for (var v in that.options.fields[f].validators) {
|
|
|
+ that.results[f][v] = that.STATUS_NOT_VALIDATED;
|
|
|
+ }
|
|
|
that.validateField(f);
|
|
|
});
|
|
|
}
|
|
|
@@ -233,8 +242,6 @@
|
|
|
if (this.invalidField) {
|
|
|
this.getFieldElements(this.invalidField).focus();
|
|
|
}
|
|
|
-
|
|
|
- this._disableSubmitButtons(false);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
@@ -291,21 +298,27 @@
|
|
|
validators = this.options.fields[field].validators,
|
|
|
validatorName,
|
|
|
validateResult;
|
|
|
+
|
|
|
for (validatorName in validators) {
|
|
|
if (this.dfds[field][validatorName]) {
|
|
|
this.dfds[field][validatorName].reject();
|
|
|
}
|
|
|
|
|
|
+ // Don't validate field if it is already done
|
|
|
+ if (this.results[field][validatorName] == this.STATUS_VALID || this.results[field][validatorName] == this.STATUS_INVALID) {
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.results[field][validatorName] = this.STATUS_VALIDATING;
|
|
|
validateResult = $.fn.bootstrapValidator.validators[validatorName].validate(this, $field, validators[validatorName]);
|
|
|
if ('object' == typeof validateResult) {
|
|
|
this.dfds[field][validatorName] = validateResult;
|
|
|
validateResult.done(function(isValid, v) {
|
|
|
// v is validator name
|
|
|
delete that.dfds[field][v];
|
|
|
- /*
|
|
|
- if (isValid) {
|
|
|
+ if (isValid && that.formSubmitted) {
|
|
|
that._submit();
|
|
|
- }*/
|
|
|
+ }
|
|
|
});
|
|
|
}
|
|
|
|
|
|
@@ -328,7 +341,11 @@
|
|
|
var field, validatorName;
|
|
|
for (field in this.results) {
|
|
|
for (validatorName in this.results[field]) {
|
|
|
- if (this.results[field][validatorName] !== true) {
|
|
|
+ if (this.results[field][validatorName] == this.STATUS_VALIDATING) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.results[field][validatorName] == this.STATUS_INVALID) {
|
|
|
this.invalidField = field;
|
|
|
return false;
|
|
|
}
|
|
|
@@ -350,7 +367,7 @@
|
|
|
message = validator.message || this.options.message,
|
|
|
$parent = $field.parents('.form-group');
|
|
|
|
|
|
- this.results[field][validatorName] = false;
|
|
|
+ this.results[field][validatorName] = this.STATUS_INVALID;
|
|
|
this._disableSubmitButtons(true);
|
|
|
|
|
|
$parent
|
|
|
@@ -382,7 +399,7 @@
|
|
|
$errors = $parent.find('.help-block[data-bs-validator]'),
|
|
|
field = $field.attr('name');
|
|
|
|
|
|
- this.results[field][validatorName] = true;
|
|
|
+ this.results[field][validatorName] = this.STATUS_VALID;
|
|
|
|
|
|
// Hide error element
|
|
|
$errors
|
|
|
@@ -392,13 +409,15 @@
|
|
|
// If the field is valid
|
|
|
var that = this;
|
|
|
if ($errors.filter(function() {
|
|
|
- var display = $(this).css('display');
|
|
|
- return ('block' == display) || ('none' == display && that.results[field][validatorName] == null);
|
|
|
+ var display = $(this).css('display'), v = $(this).attr('data-bs-validator');
|
|
|
+ return ('block' == display) || (that.results[field][v] != that.STATUS_VALID);
|
|
|
}).length == 0
|
|
|
) {
|
|
|
+ this._disableSubmitButtons(false);
|
|
|
+
|
|
|
$parent
|
|
|
.removeClass('has-error')
|
|
|
- .addClass('has-success')
|
|
|
+ .addClass('has-success');
|
|
|
// Show the "ok" icon
|
|
|
if (this.options.feedbackIcons) {
|
|
|
$parent
|
|
|
@@ -408,10 +427,6 @@
|
|
|
.show();
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- if (this.isValid()) {
|
|
|
- this._disableSubmitButtons(false);
|
|
|
- }
|
|
|
}
|
|
|
};
|
|
|
|
nghuuphuoc