Properly implement focus on first invalid.

This commit is contained in:
Bryce Johnson 2016-09-28 12:59:58 +02:00
parent 80cbc9838e
commit 503dcacaa4
1 changed files with 6 additions and 11 deletions

View File

@ -53,17 +53,16 @@
return this.setInvalidState();
}
this.form.focusOnFirstInvalid.apply(this.form);
}
handleInvalidInput(event) {
event.preventDefault();
const currentValue = this.inputElement.val();
this.state.valid = false;
this.state.empty = false;
this.state.empty = currentValue === '';
this.renderValidity();
this.form.focusOnFirstInvalid.apply(this.form);
// For UX, wait til after first invalid submission to check each keyup
this.inputElement.off('keyup.field_validator')
.on('keyup.field_validator', this.updateValidityState.bind(this));
@ -76,7 +75,7 @@
updateValidityState() {
const inputVal = this.inputElement.val();
this.state.empty = !!inputVal.length;
this.state.empty = !inputVal.length;
this.state.valid = this.getInputValidity();
this.renderValidity();
}
@ -105,10 +104,6 @@
this.inputElement.siblings('p').hide();
this.fieldErrorElement.hide();
}
checkFieldValidity(target) {
return target.validity.valid;
}
}
const customValidationFlag = 'no-gl-field-errors';
@ -144,8 +139,8 @@
}
focusOnFirstInvalid () {
const firstInvalid = this.state.inputs.find((input) => !input.inputDomElement.validity.valid);
$(firstInvalid).focus();
const firstInvalid = this.state.inputs.filter((input) => !input.inputDomElement.validity.valid)[0];
firstInvalid.inputElement.focus();
}
}