Discussion :

[TobiCar]

Bonjour,

Voilà avant de traité mon formulaire je fais un contrôle de saisie de mes champs. le problème est que ça coince à un endroit mais je ne sais pas pourquoi...
Voici mon code :

Code javascript :

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
function surligne(champ, erreur){
    if(erreur)
        champ.style.backgroundColor = "#fba";
    else
        champ.style.backgroundColor = ""; 
}
 
function verifNom (champ){
    var regex = /^[A-Z -]+$/;
 
    if (!regex.test(champ, true)){
        surligne(champ, true);
        return false;
    }
    else{
        surligne(champ, false);
        return true;
    }
}
 
function verifPrenom (champ){
    var regex = /^[a-zA-Z -]+$/;
    if (!regex.test(champ, true)){
        surligne(champ, true);
        return false;
    }
    else{
        surligne(champ, false);
        return true;
    }
}

Code php :

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
function profile (){
    include('../../config/connexion-bdd.php');
    $utilisateurConnecte=$_POST['utilisateur-connecte'];
 
    //récuperation des utilisateurs ayant le même login que l'utilisateur connecté
    $req="SELECT nom, prenom, email, identifiant FROM utilisateurs WHERE identifiant='".$_SESSION['identifiant']."'";
    $res= $connect->query($req);
    //var_dump($res);
 
    if ($row = $res->fetch(PDO::FETCH_ASSOC)){
            echo '<form id="formulaireMdp" name="nouveau-mot-de-passe" action="confirme-mot-de-passe.php" method="post" class="mot-de-passe" onsubmit="return validationProfile(this)">
              <fieldset>
                <legend>Profile</legend>
                <div class="content-mdp">
                    <label for="nom">Nom </label>
                    <input id="nom" type="text" name="nom" onblur="verifNom(this)" size="25px" value="'.$row['nom'].'"><br />
                  <label for="prenom">Prénom </label>
                    <input id="prenom" type="text" name="prenom" onblur="verifPrenom(this)" size="25px" value="'.$row['prenom'].'"><br />
                  <label for="email">E-mail</label>
                    <input id="email" type="text" name="email" onblur="verifEmail(this)" size="25px" value="'.$row['email'].'"><br />
                  <label for="identifiant">Identifiant</label>
                  <input id="identifiant" type="text" name="identifant" onblur="verifIdentifiant(this)" size="25px" value="'.$row['identifiant'].'"><br />
                    <input type="hidden" name="utilisateur-connecte" value="'. $_SESSION['identifiant'].'" />
                  <button id="auth-submit" type="submit" name="submit">Modifier</button>
                </div>';
        }
}

Mon problème est au niveau du nom et prénom. Selon mon expression (/^[A-Z -]+$/) si je rentre un nom du type "THIBAULT" ce dernier ne devrait plus être souligné, mais rien à faire...
Et c'est le même problème avec le prénom. l'expression est "/^[a-zA-Z -]+$/" et si je rentre un prénom du type "Thibault" il est toujours souligné ...

Voici le problème en image :



Merci d'avance !

[CosmoKnacki]

À vue de nez, en survolant le code:

La méthode RegExp.prototype.test() n'accepte qu'un seul paramètre qui est la chaîne à verifier, donc le mystérieux paramètre true n'a rien à faire là.

De plus, en utilisant le boolean retourné par test on peut virer le if (On peut aussi se passer de la variable regex qui de toute manière n'est utilisée qu'un seule fois):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
function verifNom (champ) {
    var testResult = /^[A-Z -]+$/.test(champ);
 
    surligne(champ, !testResult);
    return testResult;
}

idem pour verifPrenom().

Autre chose, est-ce que la valeur de retour de verifNom et de verifPrenom est exploitée quelque part? Sinon, autant supprimer le return.

[iakou]

Bonsoir.

J'ai simplifié, notamment en éliminant votre fonction surligne()... :

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
function verifNom (champ)
{
if ( /^[A-Z]+([ -][A-Z]+)*$/.test(champ) )
     {
     champ.style.backgroundColor = "silver";
     return false;
     }
else {
     champ.style.backgroundColor = "white";
     return true;
     }
}
 
function verifPrenom (champ)
{
if ( /^[A-Z][a-z]+([ -][A-Z][a-z]+)*$/.test(champ) )
     {
     champ.style.backgroundColor = "silver";
     return false;
     }
else {
     champ.style.backgroundColor = "white";
     return true;
     }
}

- J'ai modifié vos regex (Attention c'est pas testé) NOMS et Prénoms Composés sont acceptés (les seuls " " et "-" sont autorisés comme séparateur)
- J'utilise des noms de la table des couleurs au lieu des codes qui ne veulent pas dire grand chose (voyez la table des couleurs CSS...)
- J'ai laissé les return, je pense qu'ils sont utiles...
Voilà

[TobiCar]

Bonsoir,
Excusez-moi de ne répondre que maintenant.

Autre chose, est-ce que la valeur de retour de verifNom et de verifPrenom est exploitée quelque part? Sinon, autant supprimer le return.

Oui les valeurs de verifNom et verifPrenom sont exploitées donc une fonction validant l'envoie du formulaire.

Quant à iakou, j'ai testé tes fonctions et j'ai toujours le même problème... J'ai toujours la couleur de fond avec une casse correcte...

[Bovino]

Le paramètre champ que tu passes à tes fonctions, il sort d'où et représente quoi ?
Si on se fie à son nom, il représente un champ (de formulaire j'imagine) donc un objet DOM et la condition if ( /^[A-Z][a-z]+([ -][A-Z][a-z]+)*$/.test(champ) ) ne peut jamais être vraie puisque qu'un objet DOM n'est pas une chaine...

[TobiCar]

champ, si je me trompe pas est mon paramètre en pour le onblur(this) de mon input du formulaire. Donc il récupère la saisie et la compare par rapport à l'expression rationnelle, je me trompe ? (je suis pas forcement alaise sur le DOM ....)
Donc si un objet DOM n'est pas une chaine comment je dois m'y prendre ?

Par un document.getElementById() et là faire le test par rapport à mon expression rationnelle. Et par le résultat obtenu retourner un true ou false ?

Merci encore de votre aide à tous