Tester l'exécution ou non d'une fonction

Par Xbet Mig, il y a 5 ans

Bonsoir à tous.
Je me suis lancé dans l'apprentissage du langage il y a à peine 1 mois. Je travaille sur un formulaire dont naturellement je vérifie d'abord la validité des données saisies avec ma fonction chekInputs(). Je voudrais ensuite faire une redirection si et seulement si je n'ai d'erreur nulle part.
Ce qui voudra dire que la redirection ne serait possible que si la fonction setErrorFor() que j'ai plusieurs fois sollicité dans mon chekInputs(), n'est pas exécuté au cours de la validation.
Donc je me demande s'il existerait une fonction qui me permettrait de compter le nombre de fois où une quelconque fonction a été exécuté lors d'un traitement.
Pour l'instant je suis toujours redirigé même en cas d'erreur au niveau d'un champ. Ce qui n'est pas étonnant vu que ma fonction redirect() s'exécute sans condition pour le moment.
J'ai mis le code en dessous
J'espère avoir été assez clair. J'attends impatiemment vos interventions. Merci à tous !

Code:

const form = document.getElementById('form'); const username = document.getElementById('username'); const email = document.getElementById('email'); const password = document.getElementById('password'); const password2 = document.getElementById('password2'); form.addEventListener('submit', e => { e.preventDefault(); //1- Vérification des champs checkInputs(); //2- Redirection sans condition pour l'instant redirect() }); function checkInputs(){ //corps const usernameValue = username.value.trim(); const emailValue = email.value.trim(); const passwordValue = password.value.trim(); const password2Value = password2.value.trim(); if(usernameValue === '') { setErrorFor(username, 'Username cannot be blank'); } else { setSuccessFor(username); } if(emailValue === '') { setErrorFor(email, 'Email cannot be blank'); } else if (!isEmail(emailValue)) { setErrorFor(email, 'Not a valid email'); } else { setSuccessFor(email); } if(passwordValue === '') { setErrorFor(password, 'Password cannot be blank'); } else { setSuccessFor(password); } if(password2Value === '') { setErrorFor(password2, 'Password2 cannot be blank'); } else if(passwordValue !== password2Value) { setErrorFor(password2, 'Passwords does not match'); } else{ setSuccessFor(password2); } } function setErrorFor(input, message) { const formControl = input.parentElement; const small = formControl.querySelector('small'); formControl.className = 'form-control error'; small.innerText = message; } function setSuccessFor(input) { const formControl = input.parentElement; formControl.className = 'form-control success'; } function isEmail(email) { return /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(email); } function redirect() { window.location.href='test.php'; }

2 réponses

Curvata,

il y a 5 ans

Bonsoir,

tu pourrais simplement te créer une variable let error = false; que tu passes à true dans ta fonction setErrorFor() et ensuite tu fais ton if (!error)

Merci de formater ton code pour faciliter la lecture.

Xbet Mig,

il y a 5 ans

Merci Curvata !