Tester l'exécution ou non d'une fonction au cours d'un traitement

Résolu/Fermé
Migboy - Modifié le 12 avril 2021 à 20:35
 Migboy - 12 avril 2021 à 21:50
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 !

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'; 
}
A voir également:

1 réponse

jordane45 Messages postés 38178 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 16 mai 2024 4 667
12 avril 2021 à 21:04
Bonjour
Initialiser une variable globale (c'est-à-dire en dehors de toute fonction )
mets-la à false au début de ta fonction checkinput et passe là à true si jamais tu tombes sur une erreur
Puis au niveau de ta redirection il te suffit de tester la valeur de cette variable
0
Merci beaucoup #Jordane45, Une solution simple qui marche à merveille.
0