47 lines
1.3 KiB
JavaScript
47 lines
1.3 KiB
JavaScript
import { Utility } from '../../core/utility';
|
|
|
|
const FORM_ERROR_REMOVER_INITIALIZED_CLASS = 'form-error-remover--initialized';
|
|
const FORM_ERROR_REMOVER_INPUTS_SELECTOR = 'input:not([type="hidden"]), textarea, select';
|
|
|
|
const FORM_GROUP_SELECTOR = '.form-group';
|
|
const FORM_GROUP_WITH_ERRORS_CLASS = 'form-group--has-error';
|
|
|
|
@Utility({
|
|
selector: 'form',
|
|
})
|
|
export class FormErrorRemover {
|
|
|
|
constructor(element) {
|
|
if (!element) {
|
|
throw new Error('Form Error Remover utility needs to be passed an element!');
|
|
}
|
|
|
|
if (element.classList.contains(FORM_ERROR_REMOVER_INITIALIZED_CLASS)) {
|
|
return false;
|
|
}
|
|
|
|
// find form groups
|
|
const formGroups = Array.from(element.querySelectorAll(FORM_GROUP_SELECTOR));
|
|
|
|
formGroups.forEach((formGroup) => {
|
|
if (!formGroup.classList.contains(FORM_GROUP_WITH_ERRORS_CLASS)) {
|
|
return;
|
|
}
|
|
|
|
const inputElements = Array.from(formGroup.querySelectorAll(FORM_ERROR_REMOVER_INPUTS_SELECTOR));
|
|
if (!inputElements) {
|
|
return false;
|
|
}
|
|
|
|
inputElements.forEach((inputElement) => {
|
|
inputElement.addEventListener('input', () => {
|
|
formGroup.classList.remove(FORM_GROUP_WITH_ERRORS_CLASS);
|
|
});
|
|
});
|
|
});
|
|
|
|
// mark initialized
|
|
element.classList.add(FORM_ERROR_REMOVER_INITIALIZED_CLASS);
|
|
}
|
|
}
|