[AJAX] Comportement différent entre IE et FF2
Bonjour,
En cliquant sur une vignette photo, je veux afficher un agrandissement au moyen d'une requête Ajax traitée en php. Mon module test fonctionne très bien avec IE et me donne, avec FF2, l'erreur suivante : Postamble not defined.
Sans doute ai-je fait une erreur de syntaxe ?
Les images s'appellent img1, img2 etc... et je veux afficher dans le conteneur <div id="reponse">
Voici le code d'appel de la requête (ajaxpostimage.php):
<html>
<!-- Date de création: 22/11/2006 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>MODULE AJAX DE BASE</title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="François LOUP">
<meta name="generator" content="WebExpert 6">
<!-- <script language="JavaScript" src="fonctions.js"></script> -->
<script language="JavaScript" type="text/JavaScript">
var requete = null;
var choix = null;
function creerRequete() {
try {
requete = new XMLHttpRequest();
} catch (essaimicrosoft) {
try {
requete = new ActiveXObject("Msxml2.XMLHTTP");
} catch (autremicrosoft) {
try {
requete = new ActiveXObject("Microsoft.XMLHTTP");
} catch (echec) {
requete = null;
}
}
}
if (requete == null)
alert("Impossible de créer l'objet requête!");
}
function traiterRequete(choix) {
creerRequete();
var option = document.getElementById(choix).value;
alert(option);
var url = "traitementPostImage.php";
requete.open("POST", url, true);
requete.onreadystatechange = actualiserPage;
requete.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
requete.send("choix="+option);
}
function actualiserPage() // A aménager en fonction du traitement à effectuer
{
if (requete.readyState == 4)
{
var nouvValeur = requete.responseText;
var obj = document.getElementById("reponse");
obj.innerHTML = nouvValeur;
}
}
</script>
</head>
<body>
<div align="center">
<?php
// affichage des vignettes cliquables :
for($i=1 ;$i <6 ; $i++)
{
$id = "choix".$i;
$name = "choix".$i;
$src = "img".$i.".jpg";
$value = "img".$i;
echo "<a href=\"#\"><img border=\"0\" id=\"$id\" name=\"$name\"
src=\"$src\" value=\"$value\" onClick=\"traiterRequete(id)\"></a> ";
}
?>
<!-- Emplacement de la réponse -->
<div id="reponse">Cliquez sur la photo à afficher</div>
<!-- Fin d'emplacement de la réponse -->
</div>
</body>
</html>
Voici celui du traitement de la requête (traitementPostImage.php) :
<?php
$choix = $_POST['choix'];
echo "Photo ".$choix.":<br />";
switch ($choix)
{
case "img1":
echo "<img src=\"img1.jpg\" width=\"150\" border=\"0\">";
break;
case "img2":
echo "<img src=\"img2.jpg\" width=\"150\" border=\"0\">";
break;
case "img3":
echo "<img src=\"img3.jpg\" width=\"150\" border=\"0\">";
break;
case "img4":
echo "<img src=\"img4.jpg\" width=\"150\" border=\"0\">";
break;
case "img5":
echo "<img src=\"img5.jpg\" width=\"150\" border=\"0\">";
break;
default:
echo "Choisissez une option valide";
}
?>
Vous pouvez voir la page ici
Merci d'avance à celui ou ceux qui pourront me dépanner, sachant que je suis preneur d'une autre solution Ajax pour résoudre mon problème.
Bien à vous
Pacopau
Répondre avec citation
Partager