Bonjours à tous

je cherche à savoir comment permettre à l'utilisateur d'être informé en temps réel des valeurs qu'il inscrit dans les champs.
En effet, j'ai besoin de valider des membres pas javascript, mais je ne souhaite pas les faire attendre pour leur dire ce qui ne vas pas.
Je cherche à leur écrire dans une DIV le message d'erreur.

Par exemple:

Si il clique sur l'email et ne met pas un email valide, lui dire

Format de l'email invalide.

J'ai un début de script qui permet de définir l'éxistance du pseudo choisi dans la BdD, et je souhaite faire cela pour tout le reste.

Je vous met le script JS pour la verif login, et le formulaire html.

Merci de votre aide


Le 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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
function writediv(texte)
{
	document.getElementById('PseudoBox').innerHTML = texte;
}
function verifLogin(Login)
{
	if(Login != '')
	{
		if(Login.length<2)
		writediv('<span style="color:#cc0000;font-size:11px;font-weight:bold;">Trop court</span>');
		else if(Login.length>30)
		writediv('<span style="color:#cc0000font-size:11px;font-weight:bold;">Trop long</span>');
		else if(texte = file('verifLogin.php?Login='+escape(Login)))
		{
		if(texte == 1)
		writediv('<img src="ic_erreur.png" alt="Login pris" />');
		else if(texte == 2)
		writediv('<img src="ic_valide.png" alt="Login libre" />');
		else
		writediv(texte);
		}
	}
}
function file(fichier)
{
	if(window.XMLHttpRequest) // FIREFOX
	xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject) // IE
	xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
	else
	return(false);
	xhr_object.open("GET", fichier, false);
	xhr_object.send(null);
	if(xhr_object.readyState == 4) return(xhr_object.responseText);
	else return(false);
}
// *****
	function getXhr(){
                                var xhr = null; 
if(window.XMLHttpRequest) // Firefox et autres
   xhr = new XMLHttpRequest(); 
else if(window.ActiveXObject){ // Internet Explorer 
   try {
	                xhr = new ActiveXObject("Msxml2.XMLHTTP");
	            } catch (e) {
	                xhr = new ActiveXObject("Microsoft.XMLHTTP");
	            }
}
else { // XMLHttpRequest non supporté par le navigateur 
   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
   xhr = false; 
} 
                                return xhr;
	}
 
	/**
	* Méthode qui sera appelée sur le click du bouton
	*/
	function go(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
	// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
	if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('Categories').innerHTML = leselect;
	}
}
 
// Ici on va voir comment faire du post
xhr.open("POST","ajaxLivre.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de la SousCategorie
sel = document.getElementById('SousCategorie');
cat = sel.options[sel.selectedIndex].value;
xhr.send("SousCategorie="+cat);
	}
//*****
 
function couleur(obj) {
     obj.style.backgroundColor = "#FFFFFF";
}
Le formulaire

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
	<form class="form" action="index.php?s=reg" method="post">
	<table style="width:600px;background-color:#ffffff;" cellspacing="0" cellpadding="10">
		<tr style="width:100%;">
			<td style="width:60%;"> </td>
			<td style="width:30%;"> </td>
			<td style="width:10%;"> </td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Nom :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="Nom" value="" size="20" type="text">
			</td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Prenom :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="Prenom" value="" size="20" type="text">
			</td>
		</tr>
		<tr>
 
			<td><span style="color:#000000;font-weight:bold;">Pseudo :</span><span style="color:#ff0000;">*</span></td>
			<td>
<!-- ICI LE CHAMP LOGIN -->
			<input name="Login" value="" size="20" type="text" onKeyUp="verifLogin(this.value)">
			</td>
			<td><div id="PseudoBox"></div></td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Mot de passe :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="Password" value="" size="20" type="password">
			</td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Confirmer Mot de passe :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="VPassword" value="" size="20" type="password">
			</td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Email :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="Email" value="" size="20" type="text">
			</td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Vérifier Email :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="VEmail" value="" size="20" type="text">
			</td>
		</tr>
		<tr>
			<td><span style="color:#000000;font-weight:bold;">Téléphone :</span><span style="color:#ff0000;">*</span></td>
			<td colspan="2">
	<input name="Telephone" value="" size="20" type="text">
			</td>
		</tr>
		<tr>
			<td>
			<input name="Statut" value="Membre" type="hidden"/>
			<input name="Etat" value="Nonvalid" type="hidden"/>
			<input name="Date" value="<?php echo date('d-m-Y'); ?>" type="hidden"/>
			</td>
			<td><script>document.write('<input value="Inscription" name="Inscription" type="submit" />')</script>
			<noscript><span style="color:#ff0000;">! Activez JS !</span></noscript></td>
		</tr>
	</table>
	</form>
Cordialement