Проверка на валидность полей формы последовательно по одному полю - javascript
//универсальная функция валидации полей ввода форм-popup
function checkInputValidity(input, error) {
if (input[i].validity.valueMissing) {//если поле пустое
error.textContent = "Это обязательное поле";
error.classList.add('error_active');
} else if (input.validity.tooShort || input.validity.tooLong) {
//если количество символов не соответствует 2<х<30
error.textContent = "Должно быть от 2 до 30 символов";
error.classList.add('error_active');
} else if (!input.validity.valid) {
//если в поле вбита не ссылка
error.textContent = "Здесь должна быть ссылка";
error.classList.add('error_active');
} else {//если ошибок нет, то поле валидно
error.textContent = "";
}
return input.validity.valid;
}
//универсальная функция установления активности кнопке ввода submit форм
function setSubmitButtonState(check, buttonSubmit) {
if (check) {
buttonSubmit.removeAttribute('disabled');
buttonSubmit.classList.add('popup__button_active');
} else {
buttonSubmit.setAttribute('disabled', true);
buttonSubmit.classList.remove('popup__button_active');
}
}
//универсальная функция добавления обработчиков всем полям формы.
function setEventListeners(popup, input, buttonSubmit, error) {
popup.addEventListener('input', function() {
// проверяем валидность обоих инпутов
const check = checkInputValidity(input, error);
// активируем/дезактивируем кнопку сабмита в зависимости от валидности инпутов
setSubmitButtonState(check, buttonSubmit);
});
}
// вызов функции, которая создаёт обработчики для всех форм
setEventListeners(popupProfileForm, inputProfileName, buttonSubmitPopupProfile, errorName);
setEventListeners(popupProfileForm, inputProfileAboutMe, buttonSubmitPopupProfile, errorAboutMe);
В форме 2 поля. Нужно проверять их на валидность последовательно, по мере заполнения. Представленный код работает, но проверка валидности идет одновременно по обоим полям. Как сделать последовательную проверку?