diff options
author | winniehell <git@winniehell.de> | 2017-03-05 20:43:05 +0100 |
---|---|---|
committer | winniehell <git@winniehell.de> | 2017-03-05 21:22:40 +0100 |
commit | 572f9782d5e8d6307784b61db0dfce48f5118445 (patch) | |
tree | 11b25c46733462729e4303b26b4895d983f14df0 /app/assets/javascripts/gl_field_errors.js | |
parent | 4cd2ab52548e89cd7259cfb7ce320fdfa203fe84 (diff) | |
download | gitlab-ce-572f9782d5e8d6307784b61db0dfce48f5118445.tar.gz |
Remove .es6 from file extensions (!9241)
Diffstat (limited to 'app/assets/javascripts/gl_field_errors.js')
-rw-r--r-- | app/assets/javascripts/gl_field_errors.js | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/app/assets/javascripts/gl_field_errors.js b/app/assets/javascripts/gl_field_errors.js new file mode 100644 index 00000000000..e9add115429 --- /dev/null +++ b/app/assets/javascripts/gl_field_errors.js @@ -0,0 +1,48 @@ +/* eslint-disable comma-dangle, class-methods-use-this, max-len, space-before-function-paren, arrow-parens, no-param-reassign */ + +require('./gl_field_error'); + +((global) => { + const customValidationFlag = 'gl-field-error-ignore'; + + class GlFieldErrors { + constructor(form) { + this.form = $(form); + this.state = { + inputs: [], + valid: false + }; + this.initValidators(); + } + + initValidators () { + // register selectors here as needed + const validateSelectors = [':text', ':password', '[type=email]'] + .map((selector) => `input${selector}`).join(','); + + this.state.inputs = this.form.find(validateSelectors).toArray() + .filter((input) => !input.classList.contains(customValidationFlag)) + .map((input) => new global.GlFieldError({ input, formErrors: this })); + + this.form.on('submit', this.catchInvalidFormSubmit); + } + + /* Neccessary to prevent intercept and override invalid form submit + * because Safari & iOS quietly allow form submission when form is invalid + * and prevents disabling of invalid submit button by application.js */ + + catchInvalidFormSubmit (event) { + if (!event.currentTarget.checkValidity()) { + event.preventDefault(); + event.stopPropagation(); + } + } + + focusOnFirstInvalid () { + const firstInvalid = this.state.inputs.filter((input) => !input.inputDomElement.validity.valid)[0]; + firstInvalid.inputElement.focus(); + } + } + + global.GlFieldErrors = GlFieldErrors; +})(window.gl || (window.gl = {})); |