IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

script js de validation de formulaire d'inscription


Sujet :

JavaScript

  1. #1
    Membre du Club Avatar de Chakalaka
    Inscrit en
    Octobre 2007
    Messages
    152
    Détails du profil
    Informations forums :
    Inscription : Octobre 2007
    Messages : 152
    Points : 66
    Points
    66
    Par défaut script js de validation de formulaire d'inscription
    Bonjour,

    J'ai un script de validation du formulaire d'inscription qui fonctionne à merveille sur FireFox, ce n'est pas le cas malheureusement sur IE
    J'ai fais le tour du forum pour chercher des problèmes similaires , j'ai vu qu'un simple ajout de value règle le problème, ce n'est pas mon cas puisque j'ai déjà cette information dans mon formulaire.

    Mon formulaire
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    print "<form method=\"$method\" action=\"$action\" name=\"formSaisie\" onsubmit=\" return valider(this)\" >";
    print "<input type=\"hidden\" name=\"rempli\" value=\"1\">";
    Nom d’usager désiré: <input type="text" id="usager" name="usager" size="30" value="$usager" maxlength="30"/><br/>
    Mot de passe désiré: <input class="align3" id="pass" name="pass" type="password" value="$pass" size="30" maxlength="30"/><br/><br/>
    Mon script
    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
    function valider(e)
    {
     
        var champUsager = document.getElementById('usager');
        var champPass = document.getElementById('pass');
     
       // Pour assurer la compatibilité 
        var eventCapture = false;
        var event = 'submit'; // ex. mouseover, blur, click
        if (window.addEventListener) { // Standard
            obj.addEventListener(event, test( champUsager, champPass ), eventCapture);
            alert("Je suis sur std");
        }
        else if(window.attachEvent) { // IE
            obj.attachEvent('on' + event, test(champUsager, champPass));
            alert("Je suis IE");
        }
        else {
            throw "DOM Level 2 events not supported";
        }
     
    }
    function test(champUsager, champPass){
     
        // Vérifier que tous les champs sont remplis
        if((champUsager.value != "") || (champPass.value != ""))
        {
     
            var prenomOK = validerPrenom(champPrenom);                
            var nomOK = validerNom(champNom);    
            var courrielOK = validerCourriel(champCourriel);
            var licenceOK = validerAccordLisence(champLicence);
            var usagerOk = validerUsager(champUsager);    
     
            if (prenomOK  && nomOK && courrielOK && licenceOK && usagerOk)
            {
                return true;
            }
            else 
            {    
                if (e && e.preventDefault)
                    e.preventDefault();
                return false;    
            }
        }
        else
        {
            alert('Remplissez le fomulaire S.V.P');
        }
     
    }
    J'ai ajouté un bout de code que j'ai trouvé pour enregistrer l'événement sumbit qui déclenche la validation ... ça ne donne pas grande chose puisque les 2 alert n'affichent rien

    Que devrais-je faire pour assurer la compatibilité entre IE et fireFox dans mon cas ?

    Merci infiniment

  2. #2
    Membre averti
    Homme Profil pro
    Développeur informatique
    Inscrit en
    Février 2007
    Messages
    340
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Hérault (Languedoc Roussillon)

    Informations professionnelles :
    Activité : Développeur informatique
    Secteur : Transports

    Informations forums :
    Inscription : Février 2007
    Messages : 340
    Points : 350
    Points
    350
    Par défaut
    Ca me parait très compliqué tout ça.

    Quel est le but recherché ?

  3. #3
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Bonjour,
    le principal problème semble être que ta fonction valider() ne fait pas de return ...

    Elle doit renvoyer true si la validation est OK et false sinon ...
    (c'est ce true ou false qui est ensuite renvoyé par le onsubmit et bloque ou non l'envoi du form)

    A+
    Pour tout savoir sur l'utilisation du forum

    En postant votre message, n'oubliez pas les Règles du Club.

  4. #4
    Membre du Club Avatar de Chakalaka
    Inscrit en
    Octobre 2007
    Messages
    152
    Détails du profil
    Informations forums :
    Inscription : Octobre 2007
    Messages : 152
    Points : 66
    Points
    66
    Par défaut
    Citation Envoyé par madevilts Voir le message
    Ca me parait très compliqué tout ça.

    Quel est le but recherché ?
    Je veux faire en sorte que mon script de validation de formulaire fonctionne sous IE


    Merci bzz pour la réponse. Ma fonction valider retourne true ou false dépendament du résultat de test, je viens d'ajouter un return false dans le if qui vérifie si mes champs sont vide ça ne change pas grande chose

    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
    function valider(e)
    {
     
        var champUsager = document.getElementById('usager');
        var champPass = document.getElementById('pass');
     
       // Pour assurer la compatibilité 
        var eventCapture = false;
        var event = 'submit'; // ex. mouseover, blur, click
        if (window.addEventListener) { // Standard
            obj.addEventListener(event, test( champUsager, champPass ), eventCapture);
            alert("Je suis sur std");
        }
        else if(window.attachEvent) { // IE
            obj.attachEvent('on' + event, test(champUsager, champPass));
            alert("Je suis IE");
        }
        else {
            throw "DOM Level 2 events not supported";
        }
     
    }
    function test(champUsager, champPass){
     
        // Vérifier que tous les champs sont remplis
        if((champUsager.value != "") || (champPass.value != ""))
        {
     
            var prenomOK = validerPrenom(champPrenom);                
            var nomOK = validerNom(champNom);    
            var courrielOK = validerCourriel(champCourriel);
            var licenceOK = validerAccordLisence(champLicence);
            var usagerOk = validerUsager(champUsager);    
     
            if (prenomOK  && nomOK && courrielOK && licenceOK && usagerOk)
            {
                return true;
            }
            else 
            {    
                if (e && e.preventDefault)
                    e.preventDefault();
                return false;    
            }
        }
        else
        {
            alert('Remplissez le fomulaire S.V.P');
            return false;
        }
     
    }
    Un aperçu de la fonction qui test si le champ user est valide

    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
    function validerUsager(champUsager){
    	var expressionReguliere = /^[a-zA-Z\d]{5,30}$/;
     
     
    	if(!expressionReguliere.test(champUsager.value))
    	{
          alert('Veuillez entrer un nom d\'usager valide ).');
    	  champUsager.style.backgroundColor = "#fba";
    	  return false;
    	}
    	else
    	{
    		champUsager.style.backgroundColor = "";
    		return true;
    	}
     
    }
    Ya til un code particulier à ajouter pour assurer la compatibilité ?

  5. #5
    Membre du Club Avatar de Chakalaka
    Inscrit en
    Octobre 2007
    Messages
    152
    Détails du profil
    Informations forums :
    Inscription : Octobre 2007
    Messages : 152
    Points : 66
    Points
    66
    Par défaut
    ça l'air que le problème vient du addEventListner comment l'utiliser ? que dois-je lui passer en paramètre ? c'est l'argument listner qui m'intrigue dois je lui passer la fonction qui valide le champ prenom ?


    J'ai le code suivant
    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
     
    function valider(e)
    {
        var champPrenom = document.getElementById('prenom');
     
        alert("Je suis dans valider");
     
        if(champPrenom.value != "")
        {
            alert("Les champs ne sont pas vide");
     
            var eventCapture = false;
            var event = 'submit';
            if (window.addEventListener) 
           { 
                champPrenom.addEventListener(event, alert("toto"), eventCapture);
                alert("Je suis sur std");
            }
            else if(window.attachEvent) 
            { // IE
                 champPrenom.attachEvent('on' + event, function()       {alert("addEventListener de IE !"); });
                alert("Je suis IE");
            }
            else {
                throw "DOM Level 2 events not supported";
            }
     
            var prenomOK = validerPrenom(champPrenom);                
     
            if (prenomOK)
            {    
                alert("Le prenom est OK");
                return true;
            }
            else 
            {    
                if (e && e.preventDefault){
                    e.preventDefault();
                }
                alert("le prenom n'est pas ok");
                return false;    
            }
        }
        else
        {
            alert('Veuillez remplir le champ prenom');
            return false;
        }
    }
    En mettant un alert dans la fonction du listner mes popup s'affichent mais l'inscription ne fonctionne pas

    PS: J'ai testé avec
    champPrenom.attachEvent('on' + event, validerPrenom, eventCapture);
    Ça ne fonctionne pas non plus

Discussions similaires

  1. Validation de formulaire: script faux?
    Par misterZ dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 17/09/2009, 18h03
  2. Réponses: 2
    Dernier message: 07/07/2009, 11h17
  3. Script de validation de formulaire
    Par rberthou dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 23/01/2008, 00h44
  4. [AJAX] Rendre full ajax un script de validation de formulaire
    Par Darkenshin dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 21/01/2008, 23h58
  5. Classe ou script de validation des formulaires.
    Par __fabrice dans le forum Langage
    Réponses: 22
    Dernier message: 30/12/2005, 10h26

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo