[AJAX] AJAX ASYNCHRONE incompréhensible
Bonjour à tous, felicitations pour ce forum plein de bonnes choses..
Je vous explique mon problème, un vrai casse tête...
Je souhaite effectuer en Ajax une vérification de mon formulaire. Jusqu'a aujourd'hui tout allait bien, mais j'avais définit la requête en false, donc, synchrone.
Comme le script va chercher dans ma BDD tous les pseudos des visiteurs, pour verifier que le pseudo entré n'est pas déjà utilisé, pareil pour les emails, l'écran reste figé, ce qui risque de faire fuir tout le monde..:yaisse2:
J'aimerai donc mettre le script en mode asynchrone, mais là .. PLUS RIEN..
Je suis resté 24 h d'affilée dessus (je suis insomniaque:aie:), et je n'ai toujours pas trouvé la solution, pourtant je suis bon en Google...
Je vais donc vous donner simplement le script javascript correspondant au champ "pseudo" qui me pose problème, et je vous donnerai ensuite la version synchrone fonctionnelle.
Si vous ne me répondez pas tout de suite, c'est pas grave, j'ai préparé une corde :mrgreen:
Voici le code qui ne fonctionne pas :
Code:
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
|
function writediv(texte)
{
document.getElementById('validpseudo').innerHTML = texte;
}
function verifPseudo(pseudo)
{
if(pseudo != '')
{
if(texte = file('inc/verifpseudo.php?pseudo='+escape(pseudo)))
{
if(pseudo.length<3)
writediv('<img src="style/images/gif/invalide.gif"/><div style="color:red;text-align:center;">Ce Pseudonyme semble trop court. Veuillez entrer au moins 3 caractères svp.</div>');
else if(texte == 0)
writediv('<img src="style/images/gif/valide.gif"/>');
else if(texte == 1)
writediv('<img src="style/images/gif/invalide.gif"/><div style="color:red;text-align:center;">Pseudo indisponible</div>');
else if(texte == 2)
writediv('<img src="style/images/gif/invalide.gif"/><div style="color:red;text-align:center;">Ce Pseudonyme ne semble pas valide, seuls ces caractères spéciaux: "<strong> _ - . </strong>" sont acceptés.</div>');
}
}
}
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,true);
xhr_object.send(null);
xhr_object.onreadystatechange = function()
{
if (xhr_object.readyState == 4)
{
return(xhr_object.responseText);
}
}
} |
Je vous explique rapidement le principe :
La valeur du champs "pseudo" est récupérée par javascript, envoyée par GET à verifpseudo.php?pseudo=... ,
La page verifpseudo.php traite la valeur avec une regex pour verifier que le format est valide, puis va chercher dans la bdd les pseudos similaires.
Elle renvoie en echo "0" si le pseudo est valide et qu'il n'existe pas, "1" s'il est valide mais qu'elle existe, "2" s'il est syntaxiquement incorrect.
Le script javascript verifie egalement que le pseudo n'est pas trop court, et enfin il ecrit dans une div de la page un message d'erreur correspondant, ou une petite icone pour montrer qu'il est valide.
:king:
J'espere que vous avez tout compris.
Voici enfin le code qui fonctionnait mais qui fige l'écran :
Code:
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
|
function writediv(texte)
{
document.getElementById('validpseudo').innerHTML = texte;
}
function verifPseudo(pseudo)
{
if(pseudo != '')
{
if(texte = file('inc/verifpseudo.php?pseudo='+escape(pseudo)))
{
if(pseudo.length<3)
writediv('<img src="style/images/gif/invalide.gif"/><div style="color:red;text-align:center;">Ce Pseudonyme semble trop court. Veuillez entrer au moins 3 caractères svp.</div>');
else if(texte == 0)
writediv('<img src="style/images/gif/valide.gif"/>');
else if(texte == 1)
writediv('<img src="style/images/gif/invalide.gif"/><div style="color:red;text-align:center;">Pseudo indisponible</div>');
else if(texte == 2)
writediv('<img src="style/images/gif/invalide.gif"/><div style="color:red;text-align:center;">Ce Pseudonyme ne semble pas valide, seuls ces caractères spéciaux: "<strong> _ - . </strong>" sont acceptés.</div>');
}
}
}
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);
} |
Voila. Après de (très) nombreux essais, j'ai remarqué par exemple qu'en faisant :
Code:
alert(xhr_object.responseText);
au lieu de return() , j'obtenais dans la fenetre d'erreur la réponse PHP (0,1,2).
Le script va donc correctement chercher les infos... mais ne veut plus les afficher dans la div...
Tiens ça me donne envie de pleurer tout ça...
Bon bah euh... Bon courage :mrgreen:
Dim.
