Page 1 sur 1
Remplissage de div ok sous IE mais pas sous Firefox
Publié : 17 févr. 2007, 10:21
par AllCoKe
Salut,
J'utilise sur ma page le script suivant pour remplir 2 balises div différentes :
Code : Tout sélectionner
<script type='text/JavaScript'>
var xhr = null;
function getXhr()
{
if(window.XMLHttpRequest)xhr = new XMLHttpRequest();
else if(window.ActiveXObject)
{
try{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
}
function ShowFrame(page)
{
getXhr()
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById('page').innerHTML=xhr.responseText;
}
}
xhr.open("GET","ajax.php?page="+page,false);
xhr.send(null);
}
function ShowAlbum(page)
{
getXhr()
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById('album').innerHTML=xhr.responseText;
}
}
xhr.open("GET","ajax2.php?page="+page,false);
xhr.send(null);
}
function ShowPage(page)
{
ShowFrame(page);
ShowAlbum(page);
}
</script>
Et j'appelle mes 2 includes comme ça :
<div id="page"></div> <div id="album"></div>
Mon fichier ajax.php contient :
Code : Tout sélectionner
<?php
$page=$_GET['page'];
if($page==2)require '2.html';
else if($page==3)require '3.html';
else if($page==4)require '4.html';
else if($page==5)require '5.html';
else require '1.html';
?>
Et ajax2.php :
Code : Tout sélectionner
<?php
$page=$_GET['page'];
if($page==2)require 'album_2.html';
else if($page==3)require 'album_3.html';
else if($page==4)require 'album_4.html';
else if($page==5)require 'album_5.html';
else require 'album_1.html';
?>
Tout fonctionne parfaitement sous IE, les deux div sont bien remplis mais sous Firefox, rien ne s'affiche à ces deux endroits.
D'où vient le problème?
Merci d'avance
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1
Publié : 17 févr. 2007, 15:41
par Benoit
Est-ce que tu peux d'une part vérifier dans la console si tu as des erreurs (menu Outils dans Firefox), et d'autre part donner l'adresse de ton site pour qu'on puisse faire le test en situation réelle ?
Publié : 17 févr. 2007, 15:52
par AllCoKe
Pas d'erreur dans la console.
Voilà l'adresse du site :
http://www.graphisme4u.net/skikopat/
On m'a rapporté que ça ne fonctionnait pas sur Firefox Mac mais je n'en ai pas pour tester, et là ça semble fonctionner sur Firefox PC (depuis que j'ai installé Firebug, je comprends pas trop là)
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.04506)
Publié : 17 févr. 2007, 17:05
par Benoit
Probablement un problème de timing alors. Si je comprends bien, tu utilises le même nom de variable pour deux objets XmlHttpRequest différents, et les deux requêtes sont consécutives voire presque simultanées.
Je pense que Firefox détruit le premier avant qu'il ait reçu la réponse et le remplace par le second, sauf quand Firebug est activé car l'extension ralentit suffisamment l'exécution des scripts pour que ça passe

Essaie en utilisant une variable xhr1 et une variable xhr2 par exemple.
Par ailleurs tu as le même problème qu'un autre site dont on a parlé récemment : il n'y a aucune solution de rechange si le script ne fonctionne pas. Tous ceux qui ont JavaScript désactivé, ainsi que les robots d'indexation des moteurs de recherche, ne verront rien de tes pages. Il suffirait pourtant de remplacer des liens comme
par
Code : Tout sélectionner
<a href="ajax.php?page=3" onclick="ShowPage(3); return false">
Publié : 17 févr. 2007, 19:52
par AllCoKe
Dans ce genre là?
Code : Tout sélectionner
<script type='text/JavaScript'>
var xhr1 = null;
var xhr2 = null;
function getXhr1()
{
if (window.XMLHttpRequest) xhr1 = new XMLHttpRequest();
else if (window.ActiveXObject)
{
try{
xhr1 = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xhr1 = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr1 = false;
}
}
function getXhr2()
{
if (window.XMLHttpRequest) xhr2 = new XMLHttpRequest();
else if (window.ActiveXObject)
{
try{
xhr2 = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xhr2 = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr2 = false;
}
}
function ShowFrame(page)
{
getXhr1();
xhr1.onreadystatechange = function()
{
if (xhr1.readyState == 4 && xhr1.status == 200)
{
document.getElementById("page").innerHTML = xhr1.responseText;
}
}
xhr1.open("GET","ajax.php?page="+page,false);
xhr1.send(null);
}
function ShowAlbum(page)
{
getXhr2();
xhr2.onreadystatechange = function()
{
if (xhr2.readyState == 4 && xhr2.status == 200)
{
document.getElementById("album").innerHTML = xhr2.responseText;
}
}
xhr2.open("GET","ajax2.php?page="+page,false);
xhr2.send(null);
}
function ShowPage(page)
{
ShowFrame(page);
ShowAlbum(page);
}
</script>
Ben ça marche toujours pas si je désactive Firebug ^^
Et pour les liens, je vais modifier ça
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.04506)
Publié : 18 févr. 2007, 17:13
par AllCoKe
Le problème pour le remplacement des liens, c'est que j'appelle ajax.php et ajax2.php dans mon script alors que
Code : Tout sélectionner
<a href="ajax.php?page=3" onclick="ShowPage(3); return false">
n'appelle que ajax.php
Et j'ai toujours pas trouvé de solution à mon problème de Firebug
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.04506)
Publié : 18 févr. 2007, 22:24
par Benoit
En fait, vu que tu utilises de toute façon des appels synchrones, je crois que tu devrais simplement lancer la seconde requête quand la première est arrivée.
Publié : 18 févr. 2007, 22:31
par AllCoKe
En faisant comment? Désolé, je débute en AJAX
Et pour ce qui est des liens, je dois garder ce que j'avais mis ?
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.04506)
Publié : 19 févr. 2007, 21:55
par AllCoKe
Si je fais ça :
Code : Tout sélectionner
<script type='text/JavaScript'>
var xhr1 = null;
var xhr2 = null;
function getXhr1()
{...}
function getXhr2()
{...}
function ShowFrame(page)
{
getXhr1();
xhr1.onreadystatechange = function()
{
if (xhr1.readyState == 4 && xhr1.status == 200)
{
document.getElementById("page").innerHTML = xhr1.responseText;
}
}
xhr1.open("GET","ajax.php?page="+page,false);
xhr1.send(null);
getXhr2();
xhr2.onreadystatechange = function()
{
if (xhr2.readyState == 4 && xhr2.status == 200)
{
document.getElementById("album").innerHTML = xhr2.responseText;
}
}
xhr2.open("GET","ajax2.php?page="+page,false);
xhr2.send(null);
}
</script>
Ca devrait les exécuter l'une après l'autre mais ça ne fonctionne toujours pas sans Firebug
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.04506)
Publié : 22 févr. 2007, 07:55
par AllCoKe
J'ai essayé de mettre uniquement une seule des 2 fonctions :
Code : Tout sélectionner
<script type='text/JavaScript'>
var xhr = null;
function getXhr()
{
if(window.XMLHttpRequest)xhr = new XMLHttpRequest();
else if(window.ActiveXObject)
{
try{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
}
function ShowPage(page)
{
getXhr()
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById('page').innerHTML=xhr.responseText;
}
}
xhr.open("GET","ajax.php?page="+page,false);
xhr.send(null);
}
</script>
Et j'ai placé des alert dedans pour voir où y'a un problème et c'est cette partie du code :
Code : Tout sélectionner
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById('page').innerHTML=xhr.responseText;
}
}
qui n'est pas interprétée par Firefox sans Firebug.
Y'a un blocage par xhr.onreadystatechange = function()
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.0.04506)