I cannot how to figure out to have a popup alert when all my conditions in my form are okay … It is homework and the teacher want a popup alert after all the fields and if these are respected the last alert popup to tell "Our form doesn’t have errors!". It is a JavaScript-jQuery form validation client-side only (no ajax or anything else). thanks for helping me!
$(document).ready(function(){
// Les variables sont mise toutes à false par défaut
var validationForm = false;
var validationPrenom = false;
var validationNomdefamille= false;
var validationCourriel = false;
var validationMotdepasse1 = false;
var validationMotdepasse2 = false;
var validationInterets = false;
var validationSports = false;
var validatonDevweb = false;
var validationAutres = false;
var validationCase1 = false;
// Créer la fonction de validation au click du bouton
$("#submitbtn").click(function(){
// Création des variables avec l'id des valeurs du formulaire
const form =$ ("#form").val();
const prenom =$("#prenom").val();
const nomdefamille =$("#nomdefamille").val();
const courriel =$("#courriel").val();
const motdepasse1 =$("#motdepasse1").val();
const motdepasse2 =$("#motdepasse2").val();
const interets =$("#interets").val();
const sports =$("#sports").val();
const devweb=$("#devweb").val();
const autres=$("#autres").val;
const case1 =$("#case1").val();
// Validation du champs prénom
if (prenom == ""){
alert("Votre prénom est requis.");
}
else if((prenom.length <3 || prenom.length > 30)){
alert("Votre prénom doit contenir entre 3 et 30 caractères");
}
else{
validationPrenom = true;
}
// Validation du champ nom de famille
if (nomdefamille == ""){
alert("Votre nom de famille est requis.");
}
else if(nomdefamille.length <3 || nomdefamille.length >30){
alert("Votre nom de famille doit contenir entre 3 et 30 caractères");
}
else{
validationNomdefamille = true;
}
//Validation du champ courriel
if (courriel == ""){
alert("Votre courriel est requis.");
}
else if (courriel.indexOf("@") <0 && (courriel.indexOf(".")<0) ){
alert("Votre courriel n'est pas valide.");
}
else{
validationCourriel = true;
}
//Validation du champ mot de passe
if (motdepasse1 == ""){
alert("Votre mot de passe est requis.");
}
else if(motdepasse1.length <10){
alert("Votre mot de passe doit contenir au moins 10 caractères");
}
else{
validationMotdepasse1 = true;
}
//Validation du champ mot de passe (validation)
if (motdepasse2 == ""){
alert("Vous devez confirmer votre mot de passe.");
}
else if(motdepasse1 !== motdepasse2 ){
alert("Vos mots de passe ne sont pas identiques");
}
else{
validationMotdepasse2 = true;
}
//Validation du champ Intérêts
if (interets == "Veuillez choisir"){
alert("Veuillez sélectionner un champ d'intérêt.");
}
else{
validationInterets = true;
}
});
if(validationPrenom && validationNomdefamille && validationCourriel && validationMotdepasse1 && validationMotdepasse2 && validationInterets){
alert("Votre formulaire ne contient aucune erreur!");
}
});
YOur last condition need to be in event click.
You can also use a array to check errors.
That code scares me o.o
but to answer your question, you’r last
if ()
check with the final alertalert("Votre formulaire ne contient aucune erreur!");
is outside your jQuery click function. So just move that up.