Fazza Razaq Amiarso• 2,340
@fazzaamiarso
Posted
Hi Rom! Clean Solution!
Here is my refactor, I just abstracted the dom manipulation to a function
function checkInputError(errorCondition, inputField, errorText){
const toggleClass = errorCondition ? inputField.classList.add : inputField.classList.remove;
toggleClass("active");
errorText.style.display = errorCondition ? 'block' : "none";
}
input[0].addEventListener('input', (e) => {
const value = e.target.value;
checkInputError(value.length <= 0, input[0], errorTxt[0]);
});
input[1].addEventListener('input', (e) => {
const value = e.target.value;
checkInputError(value.length <= 0, input[1], errorTxt[1]);
});
input[2].addEventListener('input', (e) => {
const value = e.target.value;
checkInputError(!validateEmail(value), input[2], errorTxt[2]);
})
input[3].addEventListener('input', (e) => {
const value = e.target.value;
checkInputError(value.length <= 0, input[3], errorTxt[3]);
});
I hope it helps! Cheers!
Marked as helpful
0