Probleme en ajax/js

dacosta67 Messages postés 4 Date d'inscription vendredi 9 octobre 2009 Statut Membre Dernière intervention 18 août 2011 - 18 août 2011 à 16:32
cs_titi57100 Messages postés 34 Date d'inscription samedi 15 mars 2003 Statut Membre Dernière intervention 23 août 2011 - 23 août 2011 à 14:08
Bonjour ,
J'ai souhaite afficher le chargement de mon image et le résultat de mon script php.D'aprés firefox mon erreur est au niveau de :objetXHR.open("get","gainAleatoire.php?acticache="+temps,true);
J'ai ne comprends pas pourquoi jai cette erreur.
Je vous envoie mon code entier.voici mon MoteurAjax.js[list]function jouer()
{

objetXHR = creationXHR();
var temps = new Date().getTime();
//requete asynchrone et affectation anti cache
objetXHR.open("get","gainAleatoire.php?acticache="+temps,true);
//fonction de rappelle
objetXHR.onreadystatechange=ActualiserPage;
//gestion de bouttons
document.getElementById("button").disable=true;
document.getElementById("charge").style.visibility="visible";
//envoie de la requete
objetXHR.send();
}

function ActualiserPage()
{
if(objetXHR.readystate=4 && objetXHR.status==200)
{
var reponse = objetXHR.responseText;
//actualisation du resultat
//actualiser le contenu de l'element resultat avec reponse
actualiserContenu("resultat", reponse);
//gestion du boutton et image
document.getElementById("button").disable=false;
document.getElementById("charge").style.visibility="hidden";
}
}

/list,le fonctionAjax.js[list]

//creation de xhtmlRequest
function creationXHR(){
var xmlhttp;
if(window.XMLHttpRequest){
//pour tous les broswer ie,firefox,chrome,safari,opera,ie
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}

function SupprimerContenu(element)
{
if(element !=null)
{
while(element.firstChild)
element.removeChild(element.firstChild);
}
}

function RemplacerContenu(id,texte)
{
var element = getElementById(id);
if(element !=null)
{
SupprimerContenu(element);
var nouveauContenu = document.createTextNode(texte);
element.appendChild(nouveauContenu);
}
}


/list,mon index.html[list]
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="fonctionAjax.js"></script>
<script type="text/javascript" src="fonctionMachine.js"></script>
</head>



<!-----------------ZONE DE TEXT------------------------------------------------------->
Bravo
Vous avez gagnereuros


<!------------------------------------------ZONE IMAGE-------------------------------->

<!----------------------Zone Formulaire----------------------------------------------->


<form method="GET">
indiquez votre nom:

avant de

</form>



</html>
/listet mon .php[list]
<?php
//indication que la reponse qu'on aura sera du text
header("Content-Type:text/plain");
//anticache
header("Cache-Control: no-cache,private");

//simulation de temps d'attend de 2 Secondes
sleep(2);
//calcule de valeur aleatoire entre 0 et 100
$Randium = rand(0,100);
//envoie de la reponse
echo $Randium;

?>
/list et mon .css[list]
body,h1,h2,p{font-size:1em; margin:0; padding:0;}
body{
font-family:Verdana,Geneva,Arial,sans-serif;
text-align:center;
}
#page{
position:relative;
margin:0 auto;
width:600px;
height:200px;
border-top:medium solid #ff0000;
border-bottom:medium solid #ff0000;
}
#resultat{
font-weight:bold;
}
#formulaire{
position:absolute;
left:290px;
top:100px
}
#info{
position:absolute;
left:100px;
top:30px;
visibility:visible;
}

#charge{
position:absolute;
left:310px;
top:50px;
visibility:hidden;
}

/list
merci pour votre aide

3 réponses

TychoBrahe Messages postés 1309 Date d'inscription samedi 31 janvier 2009 Statut Membre Dernière intervention 5 juin 2013 12
18 août 2011 à 16:58
Salut,

Comme je t'ai dit sur irc, tu devrais utiliser les balsies [code=js]/code afin de mettre en forme ton code.

Et pour ton problème, dans creationXHR() tu as oublié de retourner l'objet créé.
0
TychoBrahe Messages postés 1309 Date d'inscription samedi 31 janvier 2009 Statut Membre Dernière intervention 5 juin 2013 12
18 août 2011 à 17:16
Autre chose que je viens de remarquer :

Ta fonction ActualiserPage() utilise objetXHR alros que cette variable n'est pas déclarée. En effet, si cette variable est initialisée dans la focntion jouer(), elle ne l'est nul part ailleur. Tu devrais réviser la portée des variables.
0
cs_titi57100 Messages postés 34 Date d'inscription samedi 15 mars 2003 Statut Membre Dernière intervention 23 août 2011
23 août 2011 à 14:08
Bonjour,

Comme TychoBrahe, te l'a dit, il manque le return dans le creationXHR().

Ensuite tu trouveras ci-dessous le code modifié dans un seul fichier. J'ai fait la modif sur le return.


<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<!--<script type="text/javascript" src="fonctionAjax.js"></script>
<script type="text/javascript" src="fonctionMachine.js"></script> -->
<script type="text/javascript">

//var objetXHR;

function creationXHR(){
var xmlhttp;
if(window.XMLHttpRequest){
//pour tous les broswer ie,firefox,chrome,safari,opera,ie
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;

}

function SupprimerContenu(element)
{
if(element !=null)
{
while(element.firstChild)
element.removeChild(element.firstChild);
}
}

function RemplacerContenu(id,texte)
{
var element = document.getElementById("resultat");
if(element !=null)
{
SupprimerContenu(element);
var nouveauContenu = document.createTextNode(texte);
element.appendChild(nouveauContenu);
}
}


function jouer()
{
objetXHR = creationXHR();
var temps = new Date().getTime();
//requete asynchrone et affectation anti cache
objetXHR.open("get","gainAleatoire.php?acticache="+temps,true);
//fonction de rappelle
objetXHR.onreadystatechange=ActualiserPage;
//gestion de bouttons
document.getElementById("button").disable=true;
document.getElementById("charge").style.visibility="visible";
//envoie de la requete
objetXHR.send();
}

function ActualiserPage()
{
if(objetXHR.readystate=4 && objetXHR.status==200)
{
var reponse = objetXHR.responseText;
//actualisation du resultat
//actualiser le contenu de l'element resultat avec reponse
RemplacerContenu("resultat", reponse);
//gestion du boutton et image
document.getElementById("button").disable=false;
document.getElementById("charge").style.visibility="hidden";
}
}
</script>
</head>



<!-----------------ZONE DE TEXT------------------------------------------------------->
Bravo
Vous avez gagnereuros


<!------------------------------------------ZONE IMAGE-------------------------------->

<!----------------------Zone Formulaire----------------------------------------------->


<form method="GET">
indiquez votre nom:

avant de


</form>



</html>



Cordialement,

Julien
0
Rejoignez-nous