Problème de XmlHttpRequest sous Opera et FF

[Résolu]
Signaler
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014
-
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014
-
Bonjour à tous.

Je travaille actuellement sur un site dans lequel j'utilise XmlHttpRequest. Je viens de mettre celui-ci en ligne, et je m'aperçoit que ma galerie photo ne fonctionne que sous IE et Safari. Avec Opera ou FF, il ne se passe rien. Cependant, il n'y a aucune erreur dans la console de FF.

Voici mon code :

<script language="javascript" type="text/javascript">
 var vitesse = 3000;
 var timer  = false;
 affImage('', 0, 'Vignettes', 'envoivign');
 
 function acc() { if (vitesse > 1000)  vitesse -= 1000; }
 function ral() { if (vitesse < 10000)  vitesse += 1000; }
 
 function affImage(racine, img, cible, page) {
  var xhr;
  if (window.XMLHttpRequest)   xhr = new XMLHttpRequest ();
  else if (window.ActiveXObject)  xhr = new ActiveXObject ('Microsoft.XMLHTTP');
  else {
   alert ("Votre navigateur ne gère pas l'objet XMLHttpRequest.\nVous allez être redirigé(e) vers le portfolio adapté.");
   document.location.replace("index.php?page=portfolio2");
  }
  var page = 'pages/' + page + '.php';
  xhr.open ('POST', page, true);
  xhr.setRequestHeader ('Content-Type','application/x-www-form-urlencoded');
  xhr.setRequestHeader ('Content-Type','charset=iso-8859-1');
  //xhr.overrideMimeType('text/html; charset=ISO-8859-1');
  xhr.onreadystatechange = function() {
   if (xhr.readyState == 4)
    if (document.getElementById){
     document.getElementById (cible).innerHTML = xhr.responseText;
    }
  }
  xhr.send("&racine="+racine+"&img="+img);
 }
 
 function Start(img) {
  document.getElementById("LancDiap").style.display  = "none";
  document.getElementById("Vignettes").style.display = "none";
  document.getElementById("Images").style.display  = "none";
  document.getElementById("Diap").style.display   = "block";
  document.getElementById("StopDiap").style.display  = "block";
  timer = true;
  lancerDiapo(img);
 }
 
 function Stop() {
  document.getElementById("Diap").style.display   = "none";
  document.getElementById("StopDiap").style.display  = "none";
  document.getElementById("LancDiap").style.display  = "block";
  document.getElementById("Vignettes").style.display  = "block";
  document.getElementById("Images").style.display  = "block";
  timer = false;
  affImage(document.rep.srep.value, 0, 'Vignettes', 'envoivign');
 }
 
 function lancerDiapo(img) {
  if (timer) {
   affImage(document.rep.srep.value, img, "Diap", "envoiimg");
   img++;
   setTimeout("lancerDiapo(" + img + ")", vitesse);
  }
 }
</script>

<form name="rep" method="post">
 <select id="srep" name="srep" class="Select" onchange="javascript:if(!timer){document.getElementById('Images').innerHTML='';affImage(this.value, 0, 'Vignettes', 'envoivign');}">
  <option value="" selected>Toutes les photos</option>
<?php
 foreach ($dir as $tmp){
  $a = str_replace("images/photos/","",$tmp);
  echo "<option value='".$a."'";
  if (isset ($racine)) if ($racine == $tmp) echo " selected";
  echo ">".$a."</option>";
 }
?>
 </select>
</form>

1er problème :
Lorsque l'on change la valeur du Select, la fonction affImage doit normalement récupérer une liste de photos qui dépend de la valeur.
Ca fonctionne au chargement de la page avec la valeur par défaut, mais pas ensuite lorsqu'on change la selection.

2ième problème :
Lorsqu'on lance le diaporama, les images devraient défiler mais au lieu de ça, ça reste bloqué sur la première.

Je pense donc que le problème viens de la fonction affImage qui est appelée dans les 2 cas, mais je ne vois pas d'où cela peut venir. Surtout que cela fonctionne avec certains navigateurs.

Voici également l'URL de la page, si ça peut aider :
http://www.lumieres-expressions.com

Merci d'avance

6 réponses

Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

J'ai supprimé la ligne

xhr.setRequestHeader ('Content-Type','charset=iso-8859-1');

et ça fonctionne Si quelqu'un peux m'expliquer...
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

C'est la page portfolio qui pose problème...
Messages postés
1251
Date d'inscription
mercredi 7 août 2002
Statut
Modérateur
Dernière intervention
10 avril 2013

Sous IE6 pas de problème apparent, après sélection dans la liste j'ai bien des photos qui s'affichent.
Le diaporama fonctionne également !

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

C'est seulement FireFox et opera qui posent problème.

Mais merci d'avoir regardé.
Messages postés
1044
Date d'inscription
lundi 7 mars 2005
Statut
Membre
Dernière intervention
13 juillet 2010
7
Tu as un problème dans ton script, les requêtes s'effectuent bien, mais retourne toujours le même résultat. C'est probablement un problème de cache. Rajoute ceci au début de ton script PHP et ça devrait règler le problème :

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

En passant si tu veux débogger avec Firefox je te suggère d'utiliser Firebug, ça aide beaucoup surtout pour les requêtes AJAX. J'ai écrit un tutorial sur comment l'utiliser, consulte le au besoin.

http://www.javascriptfr.com/tutoriaux/DEBOGUEUR-AVEC-FIREBUG_768.aspx
Messages postés
414
Date d'inscription
lundi 19 juillet 2004
Statut
Membre
Dernière intervention
23 septembre 2014

Merci pour Firebug, c'est clair que c'est pas mal!!

Après pas mal de recherches, je me suis rendu compte que les valeurs envoyées à la page n'arrivent pas. Je pense donc que le problème vient de  :

  xhr.send("&racine="+racine+"&img="+img);

mais je comprend pas pourquoi.

racine et img sont des pramètres de la fonction, je les ai mis dans un alert et c'est bien les valeurs attendues. Par contre la page à laquelle j'envoie la requête me dit "undefined variable" pour ces 2 variables. Elle ne les reçoit pas pour une raison qui m'echappe...