11499 sujets

JavaScript, DOM et API Web HTML5

bonjour,

Mon problème parait simple mais je m'y casse les dents.
Je me suis interessé à l'utilisation de la méthode d'échange de données avec ajax, depuis sur un site de travail j'ai pus réaliser un système de vote, un editer/citer un message avec l'objet instancié xhr...

donc tout allait bien, sauf que ma requête fonctionne sous FF, safari, opéra , android, berf partout mais pas sous IE. Sur mon les testes fonctionnes, mais pas chez les autres utilisateurs d'iE!

Je suis conscient que cela vient de mon script php ou js, j'ai donc fais 3 requêtes dfférentes et rient n'y change.

3 méthodes utilisées pour instancier l'objet xhr:

1ère:

    if (window.XMLHttpRequest || window.ActiveXObject) {
        if (window.ActiveXObject) {
            try {
                xhr = new ActiveXObject("Msxml2.XMLHTTP");
            } catch(e) {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
        } else {
            xhr = new XMLHttpRequest();
        }
    } else {
        alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
        return null;
    }


2ème

function getXMLHTTP(){
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) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e1) {
xhr = null;
}
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
}
return xhr;
}


3ème

	var xhr=null;
    if (window.XMLHttpRequest) { 
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) 
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }


Je précise que j'ai essayer d'incorporer une variable de type GET[] avec un random() mais rien n'y fait.

J'en appel donc à votre expérience pour m'en apprendre un peu plus sur une utilisation compatible IE et les pièges à éviter.

pour faire les test, 3 <div> à clicker suivant mes 3 méthodes -> http://clic-grande-taille.com/index.php



Merci.
Modifié par heatseeker (14 Aug 2013 - 20:44)
Ah oui j'ai oublié de préciser que j'ai aussi essayé en intégrant (vu dans les tutos):

- cette balise meta -> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> dans mon html.

et dans mon traitement php -> header("Cache-Control: no-cache");

merci a vous.
bonjour,

il faudrait préciser les versions d'IE qui posent problème

j'ai fait un test de mon coté, j'ai l'impression que les requetes ajax partent bien (sous IE7 par exemple) mais le traitement au retour génère une erreur, à la ligne :
document.getElementById('ici').innerHTML = vu + xhr.responseText;

mon débugger sous IE7 est assez sommaire et je peux pas t'en dire bien plus, essaie de modifier le code de cette ligne.

ensuite si je peux te donner un conseil, utilise une bibliothèque comme jquery qui masque les spécificités des navigateurs, sous jquery une requête ajax se limite à $.ajax(....)
Je te remercie beaucoup Zebrou.

Mon problème est que je veux retravailler le retour mais il fonctionne tés bien sur les autres navigateurs, donc s'est embêtant.

Ce qui est marrant c'est que tout va bien même sur ie de mon pc et seulement de mon pc...
Sinon ma version ie ciblée est ie8 minimum.

Sinon la non utilisation de jquery est volontaire, ça m'embête de devoir charger la bibliothèque (30 ko env) juste pour une requête, il doit y avoir un élément que je ne maitrise pas ou sur lequel je fais l'impasse dans mon code....

Je cherche toujours...
Bonjour,

Je me permet de relancer encore une fois mon problème que je n'arrive toujours à résoudre.
Si quelqu'un peut me conseiller...
J'ai qu'un IE10 sous la main donc je ne vais que pouvoir donner quelques pistes.
Tu peux retravailler la ligne indiquée par heatseeker sans pour autant casser la compatibilité avec les autres navigateurs. Es tu sur que sous ie les ActiveXObject ont une propriété respnseText?
Tu dis que ça marche chez toi mais pas chez les autres? C'est quoi ces autres environnements? Quelles versions d'IE, quels modes de compatibilitée? Il y a des messages d'erreurs?

Et même si tu ne veux pas charger jquery, essayes peut-être avec, juste pour voir si le problème persiste ou non.
Bonjour,

Je reprend l'idée de @sephitan ; si cela marche sur ton IE et pas sur les autres ; peut être une histoire de cache ?
Bonjour,

il faut que tu traites ce problème avec méthodologie, je t'ai indiqué la ligne qui me semblait poser pb, est-ce que tu as tenté d'inhiber cette ligne ?

Voici une méthode de PRO (sauf si t'as un débugger digne de ce nom sous IE8) :
remplace la ligne en question par un alert("coucou"); et regardes ce que çà donne, si çà marche c'est que la ligne que je t'ais indiqué pose problème et qu'il faut la modifier
Par contre si ton alert("coucou") ne donne rien, c'est que t'as pas de retour ajax le problème vient d'ailleurs et je me suis trompé dans mes tests.
merci pour votre participation,

sephitan, comme tu l'as dit, j'ai déjà instancié l'objet comme ActiveXObject et autres vues sur différents tutoriels mais rien n'y fait.

Zebrou, j'ai et avais fais mes testes juste en appliquant un alert() de réponse. Tout va bien même au niveau du formatage .responseText dans la boite de dialogue. Je précise l'erreur affiché par ie8 et plus est que lien de réponse n'existe pas... Donc oui cela est étrange comme comportement, il me manque une étape que je ne maitrise pas
Modifié par heatseeker (21 Aug 2013 - 18:57)
je pense avoir trouvé le soucis, dans ton retour ajax, tu renvoie non seulement du texte mais aussi des éléments html, en l’occurrence une div :
<div style="width: 96%; border: 2px solid orange;">
<p> traitement terminé...</p>
</div>

c'est çà qui fait bugger IE8, IE a quelques soucis avec innerHTML Smiley biggol , à priori IE8 bugge quant on lui demande de créer de nouveaux éléments du DOM par la fonction innerHTML, à creuser voir ici :
http://bezwebs.com/blog/16-blog/26-inner-html-issues-with-ie-8.html

la solution pour toi est de ne renvoyer que du texte sur une requete ajax, et rajouter ta div coté client en js !!! D'ailleurs c'est un peu plus propre
je te remercie encore zebrou pour tes essais et merci pour le lien.

J'ai retravailler autrement avec tes remarques mais rien n'y fais. Ma requete est toujours fonctionnelle sur les autres navigateurs mais bute sur lt ie9 (...)
pour infos ma requete native de retour est juste un echo php

Bref tu l'as compris je bloque toujours....
Modifié par heatseeker (24 Aug 2013 - 20:33)
tu peux renvoyer le nouveau code ? ou le remettre en ligne ? celui qui est en ligne n'a pas l'air d'avoir changé

si tu renvoies le code renvoies aussi le ajax.php
Re Zebrou,

Bon j'ai fais comme tu me la dit, j'ai supprimer les balises html de mon retour et ne renvois que du texte avec echo.

Il semblerai que cela fonctionne en effet (ie et plus). Pourrais tu me le confirmer STP...

En attendant, bonne soirée à toi.
çà marche mieux, en tout cas sur les requetes ajax2 et ajax3. Sur la premiere fonction de traitement alert_ajax() y'a toujours un message d'erreur, la raison est un peu la même que précédemment, avant de recevoir la réponse ajax tu insères dans le div appelé "ici" un bloc image
document.getElementById('ici').innerHTML ='<img src="ajax-loader.gif" />';

du coup la modification du contenu par
document.getElementById('ici').innerHTML = vu + xhr.responseText;

plante sous IE, il faut enlever la ligne 44, ou alors faire autrement.

autre soucis, tes div sont ont les propriétés inline-bloc ... et cette propriété n'est pas prise en compte (ou mal) par IE6 et 7
Modifié par Zebrou (29 Aug 2013 - 20:32)
Re,

Pour ce qui est du inline-block, mon projet n'est prévu que pour ie8 et +, donc juste pour tester.
Quand tu dis que ça marche mieux pour pour ajax2 et 3, la requête fonctionne bien?
Sinon j'ai supprimer l'image de loader, pourrais-tu refaire un test stp....

Quand penses tu car je tourne toujours en rond, snif
J'ai du mal à vérifier car le cache de mon IE TESTER est mal géré, j'arrive pas à le virer.
Mais çà m'a l'air bon. Je te conseille de récupérer IE TESTER si c'est pas encore fait, tu pourra faire les tests toi-même ainsi.

Je te conseille aussi de rajouter ces lignes en tout début de ton script todo.php, çà évitera tous ces soucis de cache ( et t'auras plus besoin de rajouter des parametres random dans les appels ajax) :

header("Cache-Control: no-cache, must-revalidate");
header("Expires: Mon, 26 Jul 2000 05:00:00 GMT"); 

Modifié par Zebrou (02 Sep 2013 - 07:51)
Merci à toi pour ta patience, c'est que je rame un peu.

J'ai rajouter les 2 header() sur mes todo.php.

J'ai refais d'autres testes et voilà ce que cela me donne.

- sur mon pc de développement tout fonctionne, même sous ie en mode comptabilité.
- pareil sous android.
- sur un vieux pc sous xp et ie6 aussi.
- par contre sur autre pc, c'est la cata, que ce soit sous ie et même ff.

Je suis donc toujours dans l'incertitude, d'autant que je comptais utiliser l'ajax pour mes pages d'inscription et connexion. Peut être devrais-je renoncer? Que faire?

Pour couronné le tout, je me suis fais volé il y a 3 jours (apparemment) mes ID de connexion sur le site du zéro, je ne peux donc pas y avoir recourt. Je ferais donc un sujet sur le forum d'alsacréation pour voir si quelqu'un qui en est membre du sdz puisse m'aider à les contacter et les avertir du problème... bref tout va mal pour cette rentrée....

Cordialement.
Modifié par heatseeker (03 Sep 2013 - 18:39)
Merci pour tes conseils.
J'ai enfin réussi à rendre mes requêtes ajax sur tous les navigateurs (même ie6)

Cordialement.
Bonjour,

J'ai le même problème que toi, mon application marche sur mon poste sous ie9. Mais ça ne fonctionne pas sur les postes des collègues ( ie9 ou ie10).
J'ai suivi les conseils et ajouté les lignes de header au début de chaque page.php qui sont appelées par Ajax, comme conseillé par Zebrou, mais ça ne fonctionne toujours pas.

J'ai approximativement le même script que toi, tu pourrais me dire comment tu as fait pour régler ton problème?

Merci