[PHP + JS + AJAX] Formulaire avec vérification instantanée

Formulaire avec vérification instantanée [PHP + JS + AJAX] - PHP - Programmation

Marsh Posté le 17-04-2008 à 08:53:15    

Salut. J'aimerais crée un formulaire d'inscription et j'aimerais y inclure un système de vérification en direct, je m'explique.
 
Par exemple lorsque la personne choisit un pseudo, imaginons qu'il doit y avoir au minimum 4 lettres et maximum 12 lettres. Lorsque le pseudo est bon j'aimerais qu'une petite case à coté du champ de saisie devienne verte lorsque le pseudo est bon et rouge inversement. Par exemple lorsque l'utilisateur commence à écrire le pseudo la case doit être rouge (car moins de 4 lettres) et tout sa en direct donc.
 
Les "cases verte et rouge" correspondaient à des petites icônes en png ou gif.
 
Est-ce possible?


Message édité par Aslan117 le 21-04-2008 à 11:11:00
Reply

Marsh Posté le 17-04-2008 à 08:53:15   

Reply

Marsh Posté le 17-04-2008 à 08:59:02    

Oui, très simplement avec du javascript déclenché par un onKeyUp sur l'input correspondant.

Reply

Marsh Posté le 17-04-2008 à 09:01:41    

Il te faut utiliser du javascript et du php.
Le script javascript :
 

Code :
  1. <script type="text/javascript">
  2. function writediv(texte)
  3.      {
  4.      document.getElementById('pseudobox').innerHTML = texte;
  5.      }
  6. function verifPseudo(pseudo)
  7.      {
  8.      if(pseudo != '')
  9.                {
  10.                if(pseudo.length<4)
  11.                          writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est trop court</span>');
  12.                else if(pseudo.length>30)
  13.                          writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est trop long</span>');
  14.                else if(texte = file('http://www.editeurjavascript.com/scripts/exemples/verifpseudo.php?pseudo='+escape(pseudo)))
  15.                          {
  16.           if(texte == 1)
  17.                writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est deja pris</span>');
  18.           else if(texte == 2)
  19.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> ce pseudo est libre</span>');
  20.           else if(texte == 3)
  21.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères</span>');
  22.           else
  23.                writediv('');
  24.                          }
  25.                }
  26.      }
  27. function file(fichier)
  28.      {
  29.      if(window.XMLHttpRequest) // FIREFOX
  30.           xhr_object = new XMLHttpRequest();
  31.      else if(window.ActiveXObject) // IE
  32.           xhr_object = new ActiveXObject("Microsoft.XMLHTTP" );
  33.      else
  34.           return(false);
  35.      xhr_object.open("GET", fichier, false);
  36.      xhr_object.send(null);
  37.      if(xhr_object.readyState == 4) return(xhr_object.responseText);
  38.      else return(false);
  39.      }
  40. </script>


 
Le script php
 

Code :
  1. <?
  2. // CONNECION SQL
  3. mysql_connect("localhost", "user", "password" );
  4. mysql_select_db("base" );
  5. // VERIFICATION
  6. if(strlen($_GET['pseudo'])>4)
  7. {
  8. $result = mysql_query("SELECT pseudo FROM membres WHERE pseudo='".$_GET["pseudo"]."'" );
  9. if(mysql_num_rows($result)>=1)
  10. echo "1";
  11. else
  12. echo "2";
  13. }
  14. else
  15. echo "3";
  16. ?>


 
Vlà ! ++

Reply

Marsh Posté le 17-04-2008 à 09:06:31    

Merci beaucoup pour ces réponses très rapide, j'essaye de suite  :)

Reply

Marsh Posté le 17-04-2008 à 09:07:50    

T'as oublié l'HTML :o

Reply

Marsh Posté le 17-04-2008 à 09:14:52    

Ah oui avec le html sa serai encore mieux ^^

Reply

Marsh Posté le 17-04-2008 à 09:28:27    

Euh ouais faut pas pousser mémé non plus
 
<input type="text" id="pseudo" onkeydown="verifPseudo(this.value);">
<div id="pseudobox"></div>

Reply

Marsh Posté le 17-04-2008 à 09:48:18    

Si je puis me permettre deux remarques :
1. Il me semble que l'onKeyUp est plus approprié dans ce cas.
2. Les appelles ajax c'est bien, en abusé ça craint. En l'état, le type qui tape un pseudo de 12 caractères va faire 7 appelles pour rien. Il faudrait faire ça :

Code :
  1. <script type="text/javascript">
  2. function writediv(texte)
  3.      {
  4.      document.getElementById('pseudobox').innerHTML = texte;
  5.      }
  6. function verifPseudo(pseudo)
  7.      {
  8.      if (!verifLongueur(pseudo)
  9.           return false;
  10.      if(pseudo != '' )
  11.                {
  12.               if(texte = file('http://www.editeurjavascript.com/scripts/exemples/verifpseudo.php?pseudo='+escape(pseudo)))
  13.                          {
  14.           if(texte == 1){
  15.                writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est deja pris</span>');
  16.                return false;
  17.           }
  18.           else if(texte == 2){
  19.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> ce pseudo est libre</span>');
  20.                return true;
  21.            }
  22.           else if(texte == 3){
  23.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères</span>');
  24.                return false;
  25.           }
  26.           else
  27.                writediv('');
  28.                return false;
  29.                          }
  30.                }
  31.  
  32.              writediv('<span style="color:#1A7917">Entrez votre pseudo !</span>');
  33.              return false;
  34.      }
  35. function verifLongueur(pseudo)
  36. {
  37.        if(pseudo == '')
  38.        {
  39.             writediv('');
  40.             return true
  41.        }
  42.        if(pseudo.length<4)
  43.       {
  44.                writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est trop court</span>');
  45.                return false;
  46.        }
  47.        if(pseudo.length>12)
  48.        {
  49.               writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est trop long</span>');
  50.               return false;
  51.        }
  52.         writediv('');
  53.        return true;
  54. }
  55. function file(fichier)
  56.      {
  57.      if(window.XMLHttpRequest) // FIREFOX
  58.           xhr_object = new XMLHttpRequest();
  59.      else if(window.ActiveXObject) // IE
  60.           xhr_object = new ActiveXObject("Microsoft.XMLHTTP" );
  61.      else
  62.           return(false);
  63.      xhr_object.open("GET", fichier, false);
  64.      xhr_object.send(null);
  65.      if(xhr_object.readyState == 4) return(xhr_object.responseText);
  66.      else return(false);
  67.      }
  68. </script>


avec l'HTML :
<input type="text" id="pseudo" onkeyup="verifLongueur(this.value);">
et dans ton form : onsubmit="return verifPseudo(document.getElementById('pseudo').value);"

 

PS : Il faudrait aussi prévoir le cas d'un échec de l'appelle ajax mais bon, voilà quoi.

Message cité 1 fois
Message édité par Bob2024 le 17-04-2008 à 09:51:37
Reply

Marsh Posté le 17-04-2008 à 11:08:47    

Oki merci beaucoup encore une fois, en fait ca fait longtemps que j'ai arrêté le php donc je suis presque débutant du coup  :whistle:  Donc j'ai un peut de mal à voir comment faire les liens entre le html/php/js.
 
 
Je ne vois pas trop ou mettre le lien vers le gif ou le png des petites icônes  :(  
Ici par exemple si le pseudo est inférieur ou égal à 4 sa affiche :
 
" '+pseudo+' :</b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères "
 
On peut mettre une url d'une icône avec la possibilité de la placée avec du css?

Reply

Marsh Posté le 17-04-2008 à 11:12:12    

Salut,
 
Je ne vois vraiment pas l'intérêt de faire une requête AJAX sur un évènement onSubmit. Autant vérifier en PHP!
 
Un bouton ou l'évènement onBlur serait plus approprié.

Code :
  1. <input type="text" id="pseudo" onkeyup="verifLongueur(this.value);" onBlur="verifPseudo(this.value);">
  2. <div id="pseudobox"></div>


 
De plus, je ne vois pas non plus l'intérêt de vérifier une deuxième fois la longueur du pseudo
 
Enfin, je met en garde contre les dangers de ces solutions : il faut refaire ces vérifs en PHP lors de la validation du formulaire !
Pensez au pauvre internaute qui n'a pas mis a jour son navigateur depuis les années 80 et donc qui ne supportent pas Javascript, ou à ceux qui l'on délibérément désactivé.

Reply

Marsh Posté le 17-04-2008 à 11:12:12   

Reply

Marsh Posté le 17-04-2008 à 11:22:21    

Nop, il me faut ce système la, je veut de l'instantané et tant pis pour ceux qui ne gèrent pas js  :pt1cable:

Reply

Marsh Posté le 17-04-2008 à 11:31:52    

Melendril a écrit :


De plus, je ne vois pas non plus l'intérêt de vérifier une deuxième fois la longueur du pseudo


Bin, jusque là, on a juste insulté l'utilisateur en rouge, on lui a pas interdit d'envoyer le formulaire. sinon, pour le onblur, ouai, mais je maintient qu'il n'est pas util de recharger la page pour l'insulter. Un appelle ajax est quand même plus lèger.
 

Melendril a écrit :


Enfin, je met en garde contre les dangers de ces solutions : il faut refaire ces vérifs en PHP lors de la validation du formulaire !
Pensez au pauvre internaute qui n'a pas mis a jour son navigateur depuis les années 80 et donc qui ne supportent pas Javascript, ou à ceux qui l'on délibérément désactivé.


Toujours :o !

Reply

Marsh Posté le 17-04-2008 à 12:25:26    

Bob2024 a écrit :


 

Code :
  1. if (texte = file ('http://www.editeurjavascript.com/scripts/exemples/verifpseudo.php?pseudo=' + escape(pseudo)) )




 
N'est il pas maintenant conseillé d'user plutôt de la fonction encodeURI() en lieu et place de escape() ?
 
PS: Vous parlez d'ajax pour une requête synchrone, n'est-ce pas déplacé ?

Reply

Marsh Posté le 17-04-2008 à 13:13:30    

si mais qui s'en soucie ?

Reply

Marsh Posté le 17-04-2008 à 21:57:11    

Salut / re tout le monde  :)  Voila ou j'en suis: http://aslan.infographie.free.fr/site20/
 
J'ai utiliser la méthode de Mxtrem (c'est le premier que j'ai essayer dans l'ordre ne le prend pas mal Bob2004).
 
Mon plus gros problème est que je n'arrive pas à chargé le php, pourtant je remplace bien la ligne qu'il faut. Ici je l'ai remplacé par une phrase qui s'affiche provisoirement.
 
La fameuse ligne:  

Code :
  1. else if(texte = file('http://www.editeurjavascript.com/scripts/exemples/verifpseudo.php?pseudo='+escape(pseudo)))


sa donne:

Code :
  1. else if(texte = file('http://aslan.infographie.free.fr/site200/test.php'+escape(pseudo)))


 
mais sa ne marche po :/
 
 
Second problème, c'est au niveau de la vérification du code, je ne trouve pas la syntaxe exacte. Voila le code:

Code :
  1. {
  2.                if (document.getElementById('passvbox').value == document.getElementById('passbox').value)
  3.       writediv('passvbox','<img src="ok.GIF"/>       Bon pass')
  4.                else
  5.                          writediv('passvbox','<img src="croix.GIF"/>       Mauvais pass')
  6.                          {


PassV est le passe de Verification. Mais sa ne marche pas non plus.
 
Vala vala  :)


Message édité par Aslan117 le 17-04-2008 à 21:58:38
Reply

Marsh Posté le 18-04-2008 à 10:25:49    

Bonjour, j'ai recopié ce que vous avez écrit en adaptant les champs à ma base de données mais j'ai une erreur qui s'affiche dans ma console (avec FireBug) à chaque fois que j'appuie sur une touche, qui est la suivante : XML filtering predicate operator called on incompatible HTMLInputElement
(onkeyup(keyup charCode=0, keyCode=68))
 
Avez-vous une idée pourquoi ça m'affiche cela ?? Parce que j'arrive pas à résoudre le problème.
 
Merci d'avance pour votre aide.

Reply

Marsh Posté le 18-04-2008 à 10:44:58    

Maintenant, j'ai cette erreur : pseudo is not a function
onkeyup(keyup charCode=0, keyCode=85)
 
(je n'ai pourtant rien changé !!)
 
Mais je n'arrive toujours pas à régler le problème !!
 
Aidez-moi please !

Reply

Marsh Posté le 18-04-2008 à 10:50:27    

J'ai trouvé !!!! C'était juste apparament que ma fonction s'appelé pseudo, mon id aussi et le name aussi !!
 
J'ai donc modifié le nom de la fonction en l'appelant verifpseudo !!

Reply

Marsh Posté le 18-04-2008 à 12:13:34    

Ca fait 1h que je cherche et je ne trouve pas pourquoi ca me dit tout le temps que le pseudo est libre alors qu'il est déjà pris !!
Quelqu'un a t-il déjà eu ce problème ??
 
Merci d'avance

Reply

Marsh Posté le 18-04-2008 à 12:29:53    

Salut dit moi pour remplacé la ligne:

Code :
  1. else if(texte = file('http://www.editeurjavascript.com/scripts/exemples/verifpseudo.php?pseudo='+escape(pseudo)))


 
tu as juste remplacé l'adresse? ("http://www.editeurjavascript.com/scripts/exemples/verifpseudo.php" ) en laissant "?pseudo='escape(pseudo)"?
 
Si oui mon problème vient du fait que j'ai pas encore activé mes bdd...
 
Mais je suis toujours bloqué à mon second problème  :sweat:
 
edit: évite les doubles post en faisant des edit ou on ne s'y retrouve plus!


Message édité par Aslan117 le 18-04-2008 à 12:30:52
Reply

Marsh Posté le 18-04-2008 à 16:08:32    

oui, moi j'ai juste remplacé cette ligne pour ton adresse en laissant "?pseudo='escape(pseudo)"
 
 
Pour ton 2ème problème, je sais pas ce qui va pas (ca doit etre ton writediv qui merde parce que le reste a l'air tout à fait juste)

Reply

Marsh Posté le 19-04-2008 à 13:24:55    

Merci pour ta réponse, euh tu a résolu ton problème?

Reply

Marsh Posté le 19-04-2008 à 14:10:54    

Non, je n'arrive pas à résoudre mon problème. J'ai essayé plein de chose mais j'ai toujours mon pseudo qui est libre (même quand il est normalement déjà pris !).
 
Ca vient surement du fait que ma requete sql me renvoie 0 résultat mais je ne vois pas pourquoi !  
($result = mysql_query("SELECT Pseudo FROM `Client` WHERE pseudo='".$_GET["Pseudo"]."'" );
 
Si quelqu'un a une idée ... je suis preneur !
Merci d'avance

Reply

Marsh Posté le 19-04-2008 à 16:13:26    

Ne passe pas une variable $_GET comme ca dans une requéte sans la vérifier et la sécuriser mais fait attention au majuscule/miniscule, ta variable $_GET['Pseudo'] a une majuscule alors que ton code plus haut lui passe la variable en minuscule (verifpseudo.php?pseudo=).


Message édité par masterpsx le 19-04-2008 à 16:15:03
Reply

Marsh Posté le 19-04-2008 à 16:19:03    

http://forum.hardware.fr/forum2.ph [...] w=0&nojs=0
leçon 1


---------------
What if I were smiling and running into your arms? Would you see then what I see now?  
Reply

Marsh Posté le 19-04-2008 à 16:49:15    


Si c'est pour "sans la vérifier et la sécuriser" dans ma phrase, je t'invite a relire ta leçon  :jap:

Reply

Marsh Posté le 19-04-2008 à 17:33:09    

Je viens d'installé FireBug et il dit " texte is not defined " c'est normal?

Reply

Marsh Posté le 19-04-2008 à 20:42:21    

masterpsx a écrit :


Si c'est pour "sans la vérifier et la sécuriser" dans ma phrase, je t'invite a relire ta leçon  :jap:

 

point du tout, c'est pour

 
Citation :

Le pseudo doit comporté au moin 5 caractères

sur la page http://aslan.infographie.free.fr/site20/

 


 [:tartalap]


Message édité par jagstang le 19-04-2008 à 20:43:18

---------------
What if I were smiling and running into your arms? Would you see then what I see now?  
Reply

Marsh Posté le 19-04-2008 à 20:48:18    

Excuse moi alors, comme tu as posté juste après moi, j'avais cru :-)

Reply

Marsh Posté le 19-04-2008 à 20:59:45    

Bon bah pour moi le code marche nikel, apres avoir installé ma bdd tousa  :D  
 
Sauf que quand je met ce bout de code:  
 

Code :
  1. function writediv(div, texte)
  2.     {
  3.     document.getElementById(div).innerHTML = texte;
  4.     }


 
Sa ne marche plus :/ pourtant j'en ai besoin

Reply

Marsh Posté le 21-04-2008 à 08:44:08    

Bin, la syntaxe de la fonction me parait bonne. Par contre, j'ai pas tout suivi mais j'ai l'impression que tu appelle cette fonction sur un élément dont tu viens de demander la "value" ... C'est un div ou un input ce "passvbox" ?

Reply

Marsh Posté le 21-04-2008 à 08:48:01    

passv est un imput (une variable), c'est l'entrée du code de vérification.
 
edit: passvbox est l'id du div, ainsi la ligne qui s'affiche s'affichait dans cette div la  :(


Message édité par Aslan117 le 21-04-2008 à 08:50:24
Reply

Marsh Posté le 21-04-2008 à 09:05:29    

La fonction est bonne ... Faudrait que tu balances ton code en entier + le html qui correspond pour qu'on voit comment tu l'appelles.

Reply

Marsh Posté le 21-04-2008 à 09:26:50    

Donc voici mon fichier html d'inscription qui est chargé dans mon index.php:
 

Code :
  1. <script type="text/javascript">
  2. function writediv(texte)
  3.      {
  4.      document.getElementById('pseudobox').innerHTML = texte;
  5.      }
  6. function verifPseudo(pseudo)
  7.      {
  8.      if(pseudo != '')
  9.                {
  10.                if(pseudo.length<4)
  11.       writediv('pseudobox','<img src="croix.GIF"/>       Le pseudo doit comporté au moin 4 caractères')
  12.                else if(pseudo.length>10)
  13.                          writediv('pseudobox','<img src="croix.GIF"/>       Le pseudo doit comporté au plus 10 caractères')
  14.                else (texte = file('http://***********.php?pseudo='+escape(pseudo)))
  15.                          {
  16.           if(texte == 1)
  17.                writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est deja pris</span>');
  18.           else if(texte == 2)
  19.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> ce pseudo est libre</span>');
  20.           else if(texte == 3)
  21.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères</span>');
  22.           else
  23.                writediv('');
  24.                          }
  25.                }
  26.      }
  27.    //pass  
  28.  function writediv(texte)
  29.      {
  30.      document.getElementById('passbox').innerHTML = texte;
  31.      }
  32. function verifPass(pass)
  33.      {
  34.    function writediv(div, texte)
  35.     {
  36.     document.getElementById(div).innerHTML = texte;
  37.     }
  38.      if(pass != '')
  39.                {
  40.                if(pass.length<4)    
  41.       writediv('passbox','<img src="croix.GIF"/>       Le pass doit comporté au moin 4 caractères')
  42.                else if(pass.length>10)
  43.                          writediv('passbox','<img src="croix.GIF"/>       Le pass doit comporté au plus 10 caractères')
  44.                else writediv('passbox','<img src="ok.GIF"/>       Le pass est bon')
  45.                          {
  46.           if(texte == 1)
  47.                writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est deja pris</span>');
  48.           else if(texte == 2)
  49.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> ce pseudo est libre</span>');
  50.           else if(texte == 3)
  51.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères</span>');
  52.           else
  53.                writediv('');
  54.                          }
  55.                }
  56.      }
  57.  
  58.  //reste
  59.  
  60.  //passv
  61.  
  62.  function writediv(texte)
  63.      {
  64.      document.getElementById('passvbox').innerHTML = texte;
  65.      }
  66. function verifPassv(pass)
  67.      {
  68.    function writediv(div, texte)
  69.     {
  70.     document.getElementById(div).innerHTML = texte;
  71.     }
  72.      if(passv != '')
  73.                {
  74.                if (document.getElementById('passvbox').value == document.getElementById('passbox').value)
  75.    
  76.       writediv('passvbox','<img src="croix.GIF"/>       Mauvais pass')
  77.                else
  78.                          writediv('passvbox','<img src="croix.GIF"/>       Mauvais pass')
  79.                          {
  80.           if(texte == 1)
  81.                writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est deja pris</span>');
  82.           else if(texte == 2)
  83.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> ce pseudo est libre</span>');
  84.           else if(texte == 3)
  85.                writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères</span>');
  86.           else
  87.                writediv('');
  88.                          }
  89.                }
  90.      }  
  91.  //mail  
  92.  function writediv(texte)
  93.      {
  94.      document.getElementById('mailbox').innerHTML = texte;
  95.      }
  96. function verifMail(mail)
  97.      {
  98.    function writediv(div, texte)
  99.     {
  100.     document.getElementById(div).innerHTML = texte;
  101.     }
  102. if (mail!='')
  103.   {
  104.  var reg_mail = /^[a-z0-9._-]+@[a-z0-9.-]{2,}[.][a-z]{2,3}$/  
  105.  if (!(reg_mail.exec(mail)!=null))
  106.    {  
  107.   writediv('mailbox','<img src="croix.GIF"/>       Mail invalide')
  108.    }    
  109.    else writediv('mailbox','<img src="ok.GIF"/>       Mail Valide')
  110.   }
  111.      }  
  112.  //reste
  113. function file(fichier)
  114.      {
  115.      if(window.XMLHttpRequest) // FIREFOX  
  116.           xhr_object = new XMLHttpRequest();
  117.      else if(window.ActiveXObject) // IE  
  118.           xhr_object = new ActiveXObject("Microsoft.XMLHTTP" );
  119.      else
  120.           return(false);
  121.      xhr_object.open("GET", fichier, false);
  122.      xhr_object.send(null);
  123.      if(xhr_object.readyState == 4) return(xhr_object.responseText);
  124.      else return(false);
  125.      }    
  126. </script>
  127.      
  128. <form method="post" action="admin/inscription.php" maxlength="10">
  129.   <div id="souligne"><h2>Inscription</h2><br/></div>
  130. Pseudo:  
  131. <input type="text" id="pseudo" name="pseudo" onkeyup="verifPseudo(this.value);"><br/><br/>  
  132. <div id="pseudobox"></div>  
  133.  
  134. Mot de passe:  
  135. <input type="password" id="pass" name="pass" onkeyup="verifPass(this.value);"> <br/><br/>
  136. <div id="passbox"></div>
  137. Verification du mot de passe:  
  138. <input type="password" id="passv" onkeyup="verifPassv(this.value);"> <br/><br/>
  139. <div id="passvbox"></div>
  140. Adresse Email:  
  141. <input type="text" id="mail" name="mail" onkeyup="verifMail(this.value);"> <br/><br/>
  142. <div id="mailbox"></div>
  143. <div id="envoyer"><p>
  144. <input type="submit" value="Envoyer" />
  145. </div>
  146. </form>
  147. </div>


 
 
J'ai un autre ptit soucis maintenant, c'est que lorsque j'écrit un pseudo inferieur à 4 lettres sa m'affiche "pseudobox" (et sa l'affiche en dessous de "adresse mail", voici un screen joint:http://aslan.infographie.free.fr/screen2.JPG (à la place de "le pseudo est libre" il y a écrit "pseudobox en blanc"
 
J'ai réussi à bidouillé un verificateur de mail qui marche bien mais je n'arrive pas à bien mettre ceux du pseudo et du mot de pass. Il faut par exemple qu'il n'y ai pas d'espace dans mon pseudo et que seulement les caracteres suivants soit accepté: [AZ] [az] [09] [éè] Pareil pour les pass. J'avais trouvé ce qu'il fallait mais je ne sais pas trop ou le mettre :s
 
 
Edit: ma verif de pseudo n'est toujours pas fonctionnel :/ (dailleur c'est du JS je ne sait pas prk je l'ai posté dans php ><, mais j'aurais besoin un peut d'aide surrement pour la verif php aussi :)


Message édité par Aslan117 le 21-04-2008 à 09:30:26
Reply

Marsh Posté le 21-04-2008 à 09:49:09    

Deux choses déja :  
Cette ligne :

Code :
  1. if (document.getElementById('passvbox').value == document.getElementById('passbox').value)


n'a pas beaucoup de sens. De plus, tu redéfinis la fonction writediv dans la fontion verifPassv, pourquoi ??
 
enfin, elle ne risque pas de marcher correctement puisqu'elle est définit deux fois (avec deux comportements) dans le corps du programme.

Reply

Marsh Posté le 21-04-2008 à 09:52:29    

Arf j'ai oublié d'enlever cette ligne, mais je bidouillais un truc pour avoir la condition:  si "passv = pass" alors écrit que c'est bon, elsif écrit que c'est faux  :sweat:


Message édité par Aslan117 le 21-04-2008 à 09:52:44
Reply

Marsh Posté le 21-04-2008 à 10:47:50    

J'y ai repensé à ton truc ... C'est les multiple définitions de la fonction writediv qui foutent le bordel. Supprime les toutes sauf la première. Au cours de l'exécution de ton programme, elle vaut d'abord

Code :
  1. #   function writediv(texte)
  2.       {
  3.       document.getElementById('mailbox').innerHTML = texte;   
  4. }


= dernière définition du corps du programme.
Puis celles que tu définis dans une les fonction que tu appelles.
Bilan : trois définition qui ne servent jamais plus un comportement totalement non pertinent pour ce que tu veux faire.
=> Une seule définition et toujours la même syntaxe pour l'appeler (i.e. (id_div, texte)).

Reply

Marsh Posté le 21-04-2008 à 11:17:47    

En fait c'est le premier qui merde, j'ai gerté la vérification du pass pour le moment, le code marche nikel:
1ere problème: les phrases qui indique si le pass est bon ou pas s'affichent à la place de ceux du mail, donc lorsque le pseudo est faux est qu'ensuite le mail est faux, la phrase  du pseudo est écrasé par celle du mail.
 
Il me faudrait un system équivalent pour indiqué les phrases du pseudo à un "id" précis , voici le code après un peut de ménage:
 

Code :
  1. <script type="text/javascript">
  2. function verifPseudo(pseudo)
  3.      {
  4.      if(pseudo != '')
  5.                {
  6.                if(pseudo.length<4)
  7.       writediv('<img src="croix.GIF"/>       Le pseudo doit comporté au moin 4 caractères')
  8.                else if(pseudo.length>10)
  9.                          writediv('<img src="croix.GIF"/>       Le pseudo doit comporté au plus 10 caractères')
  10.                else (texte = file('http//********/test.php?pseudo='+escape(pseudo)))
  11.                          {
  12.           if(texte == 1)
  13.                writediv('<span style="color:#cc0000"><b></b> ce pseudo est deja pris</span>');
  14.           else if(texte == 2)
  15.                writediv('<span style="color:#1A7917"><b></b> ce pseudo est libre</span>');
  16.           else if(texte == 3)
  17.                writediv('<span style="color:#1A7917"><b></b> n\'est pas assez long. Votre pseudo doit comporter plus de 4 caractères</span>');
  18.           else
  19.                writediv('');
  20.                          }
  21.                }
  22.      }
  23.  //pass  
  24.  function writediv(texte)
  25.      {
  26.      document.getElementById('passbox').innerHTML = texte;
  27.      }
  28. function verifPass(pass)
  29.      {
  30.    function writediv(div, texte)
  31.     {
  32.     document.getElementById(div).innerHTML = texte;
  33.     }
  34.      if(pass != '')
  35.                {
  36.                if(pass.length<4)
  37.       writediv('passbox','<img src="croix.GIF"/>       Le pass doit comporté au moin 4 caractères')
  38.                else if(pass.length>10)
  39.                          writediv('passbox','<img src="croix.GIF"/>       Le pass doit comporté au plus 10 caractères')
  40.                else writediv('passbox','<img src="ok.GIF"/>       Le pass est bon')
  41.                }
  42.      }
  43.  //mail  
  44.  function writediv(texte)
  45.      {
  46.      document.getElementById('mailbox').innerHTML = texte;
  47.      }
  48. function verifMail(mail)
  49.      {
  50.    function writediv(div, texte)
  51.     {
  52.     document.getElementById(div).innerHTML = texte;
  53.     }
  54. if (mail!='')
  55.   {
  56.  var reg_mail = /^[a-z0-9._-]+@[a-z0-9.-]{2,}[.][a-z]{2,3}$/
  57.  if (!(reg_mail.exec(mail)!=null))
  58.    {
  59.   writediv('mailbox','<img src="croix.GIF"/>       Mail invalide')
  60.    }  
  61.    else writediv('mailbox','<img src="ok.GIF"/>       Mail Valide')
  62.   }
  63.      }
  64.  //reste
  65. function file(fichier)
  66.      {
  67.      if(window.XMLHttpRequest) // FIREFOX  
  68.           xhr_object = new XMLHttpRequest();
  69.      else if(window.ActiveXObject) // IE  
  70.           xhr_object = new ActiveXObject("Microsoft.XMLHTTP" );
  71.      else
  72.           return(false);
  73.      xhr_object.open("GET", fichier, false);
  74.      xhr_object.send(null);
  75.      if(xhr_object.readyState == 4) return(xhr_object.responseText);
  76.      else return(false);
  77.      }  
  78. </script>


 
 
 
Second probléme,  FireBug indique toujours cette erreur:        texte is not defined
                                                                                 * else if(texte == 3)
 
Certes on ne voit pas l'erreur sans fireBug mais je veut un code propre sans erreurs  :pfff:


Message édité par Aslan117 le 21-04-2008 à 11:18:44
Reply

Marsh Posté le 21-04-2008 à 11:45:53    

Le premier problème c'est ça :

Code :
  1. function writediv(texte)
  2.       {
  3.       document.getElementById('mailbox').innerHTML = texte;
  4.       }


Si tu lui demande writediv(id_div, texte), il écrira id_div dans 'mailbox' !
Et non, tu ne peux pas laisser toutes ces déclarations de cette fonction. Tu pourras peut-être arriver à un comportement correcte mais c'est moche, horrible, affreux et illisible ( :o ). Et mal.

 

Edit :
Ne laisse que celle-là :

Code :
  1. function writediv(div, texte)
  2.      {
  3.      document.getElementById(div).innerHTML = texte;
  4.      }


Et seulement dans le corps du programme.
C'est celle qui correspond à tes appels


Message édité par Bob2024 le 21-04-2008 à 11:50:54
Reply

Marsh Posté le 21-04-2008 à 12:11:29    

Oki dac on en revient au point de départ, toutes les phrases s'affiche au même endroit  :pfff:  

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed