Salut a tous.

je travail sur un formulaire qui fonctionne. J'arrive a ajouter les utilisateurs dans la bases de données, hey déjà pour moi c'est fonctionnel :p

Mon soucis c'est pour le traitement des erreurs du formulaire.

En lisant le code vous trouverez un teste sur le pseudo, le mot de passe et l'email. Si des erreurs sont identifié on informe l'utilisateur qu'il doit modifier les valeurs avec un message.

Par exemple si le mot de passe est déjà utilisé, on lui indique en texte "pseudo déjà utilisé" et en css on rend la zone de saisis rouge.

Si je peux dire clairement ... le problème c'est si l'utilisateur fait plusieurs erreurs.

par exemple il rentre un pseudo trop court et un email déjà utilisé

nous avons,

deux zone de saisis rouge avec toutes les deux un message d'erreur "pseudo trop court" et "mail déjà utilisé"

L'utilisateur tente donc de faire une correction.

Il entre un mail valide mais un pseudo déjà utilisé

Ben ça ne modifie pas le formulaire.

Nous avons toujours le message d'erreur pour le mail, et toujours la zone de saisi en rouge.

Il doit surement manquer un petit quelque chose ou une façon d’écrire le code qui permet de parrer ce bug. Et j'en viens donc a vos lumières.

Voici le code html du formulaire

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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
        <form id="register_form" onsubmit="return false;" style="margin:10px;">
          <div class="form-group">
            <label for="nom">Pseudo</label>
            <input type="text" placeholder="Entrez votre pseudo" id="pseudo" name="pseudo" maxlength="16" class="form-control" required/>
            <small id="output_checkuser"></small>
          </div>
          <div class="form-group">
            <label for="pass1">Mot de passe</label>
            <input type="password" placeholder="6 caractères minimum" id="pass1" name="pass1" class="form-control" required/>
            <small id="output_pass1"></small>
          </div>
          <div class="form-group">
            <label for="pass2">Confirmez votre mot de passe</label>
            <input type="password" id="pass2" name="pass2" class="form-control" required/>
            <small id="output_pass2"></small>
          </div>
          <div class="form-group">
            <label for="email">Votre adresse e-mail</label>
            <input type="email" placeholder="pseudo@devosi.org" id="email" name="email" class="form-control" required/>
            <small id="output_email"></small>
          </div>
          <div id="status" class="alert alert-primary" role="alert">
            Merci de remplir tous les champs.
          </div>
          <input type="submit" id="bRegister" class="btn btn-primary" value="Inscription" />
        </form>

et le js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
$(document).ready(function(){
 
  //$('#general').html().fadeOut();
 
    // On fait disparaitre la div #status quand on clique dans un champ du formuaire
    $("#register_form input").focus(function(){
  		$("#status").fadeOut(800);
  	});
 
  //Fonction qui permet de tester le pseudo entre
  function check_pseudo(){
    $.ajax({
      type:	'post',
      url:	'index.php',
      data: {
        'pseudo_check' : $("#pseudo").val()
      },
      success: function(data){
        if(data == "success"){
          $("#pseudo").addClass("is-valid");
          return true;
        } else {
          $("#output_checkuser").css("color", "red").html(data);
          $("#pseudo").addClass("is-invalid");
        }
      }
    });
  }
 
  function check_password(){
    $.ajax({
      type: "post",
      url: "index.php",
      data: {
        'pass1_check' : $("#pass1").val(),
        'pass2_check' : $("#pass2").val()
      },
      success: function(data){
        if(data == "success"){
          $("#pass2").addClass("is-valid");
          $("#pass1").addClass("is-valid");
        } else {
          $("#output_pass2").css("color", "red").html(data).fadeIn(400);
          $("#pass1").addClass("is-invalid");
          $("#pass2").addClass("is-invalid");
        }
      }
    });
  }
 
  function check_email(){
    $.ajax({
      type: "post",
      url: "index.php",
      data: {
        'email_check' : $("#email").val()
      },
      success: function(data){
        if(data == "success"){
          $("#email").addClass("is-valid");
        } else {
          $("#email").addClass("is-invalid");
          $("#output_email").css("color", "red").html(data);
        }
      }
    });
  }
 
  // Traitement du formulaire d'inscription
  $("#register_form").submit(function(){
    //on verifie si le pseudo est libre ou deja utilisateur
    check_pseudo();
 
    check_password();
 
    check_email();
 
    var status = $("#status");
    var pseudo = $("#pseudo").val();
    var pass1 = $("#pass1").val();
    var pass2 = $("#pass2").val();
    var email = $("#email").val();
 
    if(pseudo == "" || pass1 =="" || pass2 == "" || email == ""){
      status.addClass("alert-danger");
      status.html("Le formulaire contient des erreurs").fadeIn(400);
    } else if (pass1 != pass2) {
      status.addClass("alert-danger");
      status.html("Le formulaire contient des erreurs").fadein(400);
    } else {
      $.ajax({
        type: "post",
        url: "index.php",
        data: {
          'pseudo' : pseudo,
          'pass1' : pass1,
          'pass2' : pass2,
          'email' : email,
        },
        beforeSend: function(){
          $("#bRegister").attr("value", "Traitement en cours ...");
        },
        success: function(data){
          if(data != "register_success"){
            status.addClass("alert-danger");
            status.html("Le formulaire contient des erreurs").fadeIn(400);
            $("#bRegister").attr("value", "Inscription");
            $("#bRegister").addClass("btn-primary").css("color", "white");
          } else {
            //status.toggleClass("alert-success");
            //$("#general").addClass("alert-primary").fadeIn(800);
            //$("#general").html("<strong>Juste une derniere etape " + pseudo + " !</strong><br/>Un lien d'activation vient de vous etre envoyé à l'adresse mail indiqué.<br/>Veuillez cliquer sur ce lien pour terminer votre inscripton et ainsi pourvoir vous connectez avec vos identifiants").addClass("alert-primary").fadeIn(400);
          }
        }
      });
    }
  });
});
il manque evidement le code .php pour les testes sur la base de données, et la base de données.

je ne vois pas comment vous permettre de faire les testes en live.

en esperant que vous compreniez le probleme que je rencontre.

merci d'avance.