Sujet Précédent Sujet Suivant

Verifier input en direct avec JavaScript ?

Fermé
Master - 22 févr. 2012 à 22:19
palrog
Messages postés
42
Date d'inscription
jeudi 2 juillet 2009
Statut
Membre
Dernière intervention
25 avril 2012
 - 23 févr. 2012 à 14:55
Bonjour,
J'ai un petit souci, j'aimerais vérifier en direct la valeur de deux input password d'un formulaire.

J'ai trouvé un script sur internet, il vérifie si il-y a que des nombres dans le input, j'aimerais pouvoir le modifier pour qu'il vérifie deux input password, ou avoir un script du genre qui vérifie sans faire submit si les deux valeurs sont identiques, si quelqu'un pourrais m'aider ça serrais sympa : 


<html><body>
<script>
function checknum()
{
var valeur = document.formulaire.champ.value;
var reg = new RegExp("[^0-9]", "gi");
if(valeur.match(reg))
{
document.getElementById("warn").innerHTML = "<img src='image.jpg' />";
}
else
{
document.getElementById("warn").innerHTML = "";
}
}
</script>
<div id="warn"></div>
<form name="formulaire">
<input type="text" name="champ" />
<input type="text" name="champ" onkeyup="checknum();" />
</form>
</body></html>


Merci.

Ps: Je suis nul en js.

1 réponse

Réponse 1 / 1
palrog
Messages postés
42
Date d'inscription
jeudi 2 juillet 2009
Statut
Membre
Dernière intervention
25 avril 2012
 21
23 févr. 2012 à 00:15
Bonjour,
Voici une adaptation du code, ça marche chez moi mais c'est à vérifier parce que je ne suis pas un pro du JS. Avec "if(valeur2 != document.getElement...), je compare la "value" du 2è champ (obtenue par le this.value dans le <input>) avec celle du 1er champ (identifié par id="pwd1").
NB: ne pas oublier qu'un test en JavaScript ne vaut rien si l'utilisateur a désactivé JavaScript... donc vaut mieux vérifier côté serveur aussi, avec PHP ou autre :-) 

<html><body>
<script>
<html><body>
<script>
function check(valeur2)
{
	if(valeur2 != document.getElementById('pwd1').value)
	{
		document.getElementById("warn").innerHTML = "<img src='image.jpg' />";
	}
	else
	{
		document.getElementById("warn").innerHTML = "";
	}
}
</script>
<div id="warn"></div>
<form name="formulaire">
<input type="text" id="pwd1" name="champ" />
<input type="text" name="champ" onkeyup="check(this.value);" />
</form>
</body></html>
</script>
<div id="warn"></div>
<form name="formulaire">
<input type="text" id="pwd1" name="champ" />
<input type="text" name="champ" onkeyup="check(this.value);" />
</form>
</body></html>
0
Master
23 févr. 2012 à 02:01
MERCI !!! ça marche mais j'arrive pas a combiner les deux en même temps, je met les deux scripts et ça marche pas :( (le premier celui de l'exemple, et le deuxième celui de vôtre réponse)

Merci
0
palrog
Messages postés
42
Date d'inscription
jeudi 2 juillet 2009
Statut
Membre
Dernière intervention
25 avril 2012
 21
23 févr. 2012 à 14:55
Désolé, je n'avais pas compris qu'il fallait faire les deux à la fois! 
<html><body>
<script>
function check(valeur2)
{
	// 1. on teste si ce sont des chiffres
	var reg = new RegExp("[^0-9]", "gi");
	if(valeur2.match(reg))
	{
		document.getElementById("warn").innerHTML = "<img src='image.jpg' />";
	}
	else
	{
		// 2. si oui, on teste si les champs sont egaux
		if(valeur2 != document.getElementById('pwd1').value)
		{
			document.getElementById("warn").innerHTML = "<img src='image2.jpg' />";
		}
		else
		{
			// 3. si tout est ok: pas d'image
			document.getElementById("warn").innerHTML = "";
		}	
	}
}
</script>
<div id="warn"></div>
<form name="formulaire">
<input type="text" id="pwd1" name="champ" />
<input type="text" name="champ" onkeyup="check(this.value);" />
</form>
</body></html>


NB Petit défaut inhérent au code (déjà présent dans les deux premiers): le test ne se fait que quand on modifie le 2è champ. Si on veut que le test se fasse quand on tape dans chacun des deux champs: 

<html><body>
<script>
function check(valeur)
{	
	// 1. on teste si ce sont des chiffres
	var reg = new RegExp("[^0-9]", "gi");
	if(valeur.match(reg))
	{
		document.getElementById("warn").innerHTML = "<img src='image.jpg' />";
	}
	else
	{
		// 2. si oui, on teste si les champs sont egaux
		if(document.getElementById('pwd1').value != document.getElementById('pwd2').value)
		{
			document.getElementById("warn").innerHTML = "<img src='image2.jpg' />";
		}
		else
		{
			// 3. si tout est ok: pas d'image
			document.getElementById("warn").innerHTML = "";
		}	
	}
}
</script>
<div id="warn"></div>
<form name="formulaire">
<input type="text" id="pwd1" name="champ" onkeyup="check(this.value);" />
<input type="text" id="pwd2" name="champ" onkeyup="check(this.value);" />
</form>
</body></html>


(Voilà, si c'est réglé, n'oubliez pas de mettre en "résolu")
0