[AJAX] Ajax avec IE et le reste du monde

Bonjour tout le monde,

Je me trouve confronter à quelques soucis sous Firefox/Opera/... que je n'ai pas sous IE. (Je sait que certain me dirons, tu as développé comme un porc, sux IE et vive firefox, mais ce n'est pas la réponse que j'attends :) ).

Donc lorsque je teste sous IE la connexion par exemple, tout se passe bien, l'utilisateur est redirigé au bon endroit. Par contre sous FF, le code suivant s'affiche (qui ne devrait pas théoriquement) et ceci deux fois :

Error code (E) = 200

Voici le code AJAX correspondant :

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

function submitLogin(login,password) { var OAjax; if (window.XMLHttpRequest) OAjax = new XMLHttpRequest(); else if (window.ActiveXObject) OAjax = new ActiveXObject('Microsoft.XMLHTTP'); OAjax.open('POST',"include/veriflogin.php",true); OAjax.onreadystatechange = function() { if (OAjax.readyState == 4 && OAjax.status==200) { if (OAjax.responseText == 1) { /* OK */ window.location='main.php'; }else{ /* PAS OK */ alert(OAjax.responseText); } } else { alert("Error code (E) =" + OAjax.status); } } OAjax.setRequestHeader('Content-type','application/x-www-form-urlencoded'); OAjax.send('login='+login+'&password='+password); }

---

Et voici le code HTML appelant le code AJAX :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

<form id="signupLogin" action="javascript:void(null);" onsubmit="submitLogin(this.login.value,this.password.value);return false;"> <tr> <td colspan="2"height="4"></td> </tr> <tr> <td><input type="text" name="login" value="Login" class="fond_noir" onfocus="if(this.value=='login')this.value='';" style="width:146px"></td> <td width="35">&nbsp;</td> </tr> <tr> <td><input type="password" name="password" value="3FsxLOR1" class="fond_noir" onfocus="if(this.value=='password')this.value='';" style="width:146px"></td> <td><div align="center"> <input name="submit" type="submit" class="bouton" style="width:30px" value="ok"> </div> </td> </tr> <tr> <td colspan="2" height="4"></td> </tr> </form>

---

Pourriez vous m'aidez à résoudre ce premier soucis ? (J'en ai un autre, mais peut être que la résolution de celui-ci me permettra de résoudre le second :) ).

Merci d'avance.

Salut,

Citation:

---

(Je sait que certain me dirons, tu as développé comme un porc,

---

Je préfère le terme cochon on peut faire du dev et utiliser un vocabulaire moins péjoratif.

Sinon dans ton cas ce n'est pas le monde qui s'est ligué contre ton code, mais simplement une petite erreur liée au processus de déroulement d'une requête AJAX, avec un effet de bord important: les tutoriels (voir par exemple: http://siddh.developpez.com/articles/ajax/) t'indiqueront qu'il faut tester d'abord readyState et ensuite le status:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

OAjax.onreadystatechange = function() { if (OAjax.readyState == 4) { if (OAjax.status==200) { if (OAjax.responseText == 1) { /* OK */ window.location='main.php'; }else{ /* PAS OK */ alert(OAjax.responseText); } } else { alert("Error code (E) =" + OAjax.status); } } }

---

Bon dev,
ERE

Merci pour ta réponse. Celà fonctionne bien maintenant.
Deux questions cependant :
1 -> Pourquoi cette contrainte ?
2 -> Dans le lien que tu as donné tu as ceci pourtant :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

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){ alert(xhr.responseText); } } xhr.open("GET","ajax.php",true); xhr.send(null); }

---

C'est une bonne remarque.
Dans ce code que tu pointes l'unique besoin est de s'assurer que la requête est terminée, et avec succès. D'où cette écriture "raccourcie".

ERE

Oki doki. Merci pour la réponse.

Même si le problème est résolu, j'ai d'autres comportement bizzare. Mais celà sera l'objet d'un nouveau post :)