Page 1 sur 1

Comparaison de 2 champs en ajax

Posté : 31 juil. 2006, 19:07
par acesyde
Bonjour a tous d'abord

voila je me suis introduit pour la première fois dans le monde de l'ajax, non pas pour nettoyer mais pour évoluer dans le sens :)

Alors le verification du login marche merveilleux mais je souhaiterais faire fonctionner aussi celle du mot de passe (première sortie en javascript aussi)

Le fichier .js

Code : Tout sélectionner

// Declaration du xhr var xhr = null; function getXhr() { if(window.XMLHttpRequest)xhr = new XMLHttpRequest(); else if(windows.ActiveXObject)xhr = new ActiveXObject("Microsoft.XMLHTTP"); else return(false); } // Fin de la déclaration function writediv(texte) { document.getElementById('errorframe').innerHTML = texte; } function verifPseudo(pseudo) { if(pseudo != '') { if(pseudo.length<3) writediv('<img src="./img/attention.gif" border="0"/>&nbsp;<b>'+pseudo+' :</b> Ce pseudo est trop court'); else if(pseudo.length>30) writediv('<img src="./img/attention.gif" border="0"/>&nbsp;<b>'+pseudo+' :</b> Ce pseudo est trop long'); else if(texte = file('./includes/verif.inc.php?pseudo='+escape(pseudo))) { if(texte == 1) writediv('<img src="./img/croix.gif" border="0"/>&nbsp;Ce login est déjà utilisé'); else if(texte == 2) writediv('<img src="./img/ok.gif" border="0"/>'); else writediv(texte); } } } function verifMDP(password, repass) { if(password != '') { if(password.length<6) writediv('<img src="./img/attention.gif" border="0"/>&nbsp;Ce mot de passe est trop court'); else if(password.length>30) writediv('<img src="./img/attention.gif" border="0"/>&nbsp;Ce mot de passe est trop long'); else if(password == repass) writediv('<img src="./img/ok.gif" border="0"/>'); else writediv('<img src="./img/croix.gif" border="0"/>&nbsp;Veuillez resaisir votre mot de passe'); } } function verifEMAIL(email) { if (email.match(/^[\w\.\-]+@([\w\-]+\.)+[a-zA-Z]+$/)) writediv('<img src="./img/ok.gif" border="0"/>'); else writediv('<img src="./img/croix.gif" border="0"/>&nbsp;email non valide'); } function file(fichier) { getXhr() xhr.open("GET",fichier, false); xhr.send(null); if(xhr.readyState == 4) return(xhr.responseText); else return(false); }
Et mon fichier général

Code : Tout sélectionner

<div id="newaccount"> <h1>Formulaire d'inscription</h1> <table> <form name= "newaccount" action=""> <tr><td>Login : </td><td><input type="text" name="login" onKeyUp="verifPseudo(this.value)" /></td><td><div id="errorframe"></div></td></tr> <tr><td>Password : </td><td><input type="password" name="password" onKeyUp="verifMDP(this.value)" /></td><td><div id="errorframe"></div></td></tr> <tr><td>Re-password : </td><td><input type="password" name="repass" onKeyUp="verifMDP(this.value)" /></td><td><div id="errorframe"></div></td></tr> <tr><td>Email : </td><td><input type="text" name="email" onKeyUp="verifEMAIL(this.value)" /></td><td><div id="errorframe"></div></td></tr> </form> </table> </div>
Bon voila et j'aimerais aussi que le message s'affiche de plus en face et pas que dans la frame du haut, mais je ne sais pas vraiment comment faire sa proprement ;)

Je vous remercie d'avance

Posté : 31 juil. 2006, 21:13
par Truc
Salut,

Tu souhaites vérifier si le passe entré ne l'est pas déjà dans la base (par un autre utilisateur) ?

Le message s'affiche en face de quoi ?
Qu'appelles tu frame ? il n'y en a pas dans le code :-k

Posté : 31 juil. 2006, 21:19
par acesyde
il y a password a taper et l'autre pour vérifier .

Je veux comparer c'est deux champs en faites.

Et j'aimerai avoir la réponses serveur juste en fasse de chaque champ input :)

voila

Posté : 31 juil. 2006, 23:22
par Truc
Tu as pratiquement tout ce qu'il faut pour la vérification des deux passes:

valid_formulaire=false;

function verifMDP(champ)
{
   var mot_passe= document.getElementById('passe1').value;
   var repass= document.getElementById('passe2').value;
   
   if(mot_passe != '')
   {     
     if(mot_passe.length<6)
     {
        writediv('<img src="./img/attention.gif" border="0"/>&nbsp;Ce mot de passe est trop court',champ);
        valid_formulaire=false;
     }
     else if(mot_passe.length>30)
     {
         writediv('<img src="./img/attention.gif" border="0"/>&nbsp;Ce mot de passe est trop long',champ);
         valid_formulaire=false;
     }
     else 
     {     	     	
     	
     	if(mot_passe == repass)
     	{
	         writediv('<img src="images/Site/ok.gif" border="0"/>',champ);          
	         valid_formulaire=true;
	     }
	     else 
          {  
			if(repass != "")             	     	
				writediv('Les deux passes sont différents.',champ);	     
			else 
				writediv('',champ);	 
			valid_formulaire=false;
         }     
      }      
   }
   else
      writediv('<img src="./img/croix.gif" border="0"/>&nbsp;Veuillez resaisir votre mot de passe',champ);
} 
on passe en paramètre l'id de l'élément qui va reçevoir le message.
Il y a également l'ajout d'une variable "valid_formulaire" initialisée à faux et qui passe à vrai uniquement dans le cas où les passes sont identiques. Cette variable servira lors de la validation du formulaire qui ne devrait se faire qui si elle vaut "true" (donc sur un appel onsubmit).

avec les deux champ:
<input type="password" name="password" id="passe1" onKeyUp="verifMDP('error_passe')" />
<input type="password" name="repass" id="passe2" onKeyUp="verifMDP('error_passe')" /> 
<span id="error_passe"></span> 
Pour écrire en face des champs suffit de choisir l'emplacement du bloc :
<span id="error_passe"></span> 
où le message sera inscrit.

La fonction d'écriture des messages devient :
function writediv(texte,champ)
{
   document.getElementById(champ).innerHTML =  texte;
}
avec l'ajout d'une variable pour le champ d'écriture, tu n'aura qu'à indiquer l'id de l'élement où écrire.

Posté : 31 juil. 2006, 23:30
par acesyde
trés gentils je te remercie, je teste sa dés que possible et je mettrais résolu si sa marche ;)

En attendant bonne soirée et encore merci pour les explications