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:
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
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"; }
Cordialement
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>
Partager