Vérification formulaire et affichage erreurs
Bonjour,
Je vérifie les champs d'un formulaire. Si au moins l'un d'entre eux est vide, j'affiche une fenêtre UI DIALOG indiquant que le formulaire est incomplet. C'est fonctionnel :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50
|
<head>
<script type="text/javascript">
$(function(){
$('.etape_2').click(function(){
valid = true;
//VERIF CHAMP TITRE
if($("#titre_insert").val()==""){
$("#titre_insert").next(".erreur").show().text("Entrer un titre");
valid = false;
}
else
{
$("#titre_insert").next(".erreur").hide();
}
//VERIF CHAMP AUTEUR
if($("#auteur_insert").val()==""){
$("#auteur_insert").next(".erreur").show().text("Entrer un auteur");
valid = false;
}
else
{
$("#auteur_insert").next(".erreur").hide();
}
if (valid == false) {
$( "#dialog_si_erreur" ).dialog({
});
}
});
</script>
</head> |
Code:
1 2 3 4 5 6 7 8 9 10 11 12
|
<input type="text" id="titre_insert" name="titre_insert" size="50"/>
<span class="erreur"style="display:none; color:#F00;"></span>
<input type="text" id="auteur_insert" name="auteur_insert" size="50"/>
<span class="erreur"style="display:none; color:#F00;"></span>
<div style="display: none;" id="dialog_si_erreur" title="Erreur !">//fenêtre DIALOG
<p>Le formulaire est incomplet !</p>
</div>
<input type="button" class="etape_2" value="Etape suivante >>" /> |
Dans ma fenêtre DIALOG, je souhaiterais afficher la liste des erreurs rencontrées. Pour arriver à mes fins, j'ai pensé à plusieurs choses :
- tester si l'erreur existe grâce à un " if ( $('.erreur').is(':visible')){..."
- utiliser la fonction each () pour boucler sur les class "erreur" (?)
- utiliser la fonction html() pour ajouter la liste des erreurs dans la DIV id="dialog_si_erreur";
Qu'en pensez-vous ? Pouvez-m'aider ? Merci.