Problème avec document.getElementById et Ajax
Posté : 30 nov. 2008, 15:07
Bonjour,
Voilà je suis en train de créer un panier qui fonctionne avec Ajax et Php.
Voici mon fichier js:
Et voici comment je l'utilise:
Les article s'ajoute bien et le panier ce vide bien mais les div qui sont censé s'afficher ne s'affiche pas.
Voici le code de mes div:
Le div loading de s'afficher et lancer la fonction caddie.selfAdd après 8 secondes mais là la fonction selfAdd se lance toute suite et la div loading ne s'ffiche pas, idem pour la div caddie.
Je ne trouve pas le pourquoi.
Merci d'avance.
Voilà je suis en train de créer un panier qui fonctionne avec Ajax et Php.
Voici mon fichier js:
Code : Tout sélectionner
var caddie = {
id: "caddie",
txt: "txt",
XmlHttpRequest: function()
{
if(document.all)
{
//Internet Explorer
return XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
}
else
{
//Mozilla
return XhrObj = new XMLHttpRequest();
}
}
};
caddie.getAdd = function(name, code, qte, price, wallpaper, self)
{
setTimeout(this.selfAdd(name, code, qte, price, wallpaper, self), 8000);
document.getElementById("loading").style.display = "block";
}
caddie.getDelete = function()
{
setTimeout(this.selfDelete(), 8000);
document.getElementById("loading").style.display = "block";
}
caddie.selfAdd = function(name, code, qte, price, wallpaper, self)
{
var XhrObj = this.XmlHttpRequest();
XhrObj.open('GET', 'ajout_panier.php?type=add&name='+name+'&code='+code+'&qte='+qte+'&price='+price+'&wallpaper='+wallpaper, true);
XhrObj.onreadystatechange = function()
{
if (XhrObj.readyState == 4 && XhrObj.status == 200)
{
document.getElementById("loading").style.display = "none";
document.getElementById(this.id).style.visibility = "visible";
document.getElementById(this.txt).innerHTML = XhrObj.responseText;
}
}
XhrObj.send(null);
}
caddie.selfDelete = function()
{
var XhrObj = this.XmlHttpRequest();
XhrObj.open('GET', 'ajout_panier.php?type=delete', true);
XhrObj.onreadystatechange = function()
{
if (XhrObj.readyState == 4 && XhrObj.status == 200)
{
document.getElementById("loading").style.display = "none";
document.getElementById(this.id).style.visibility = "visible";
document.getElementById(this.txt).innerHTML = XhrObj.responseText;
}
}
XhrObj.send(null);
}Code : Tout sélectionner
// Pour ajouter un article
<a href="#" onclick="caddie.getAdd('Reference1', '1589623', document.form1.qte_1.value, '152.00', '0', 'liste_article.php');">Ajout Panier</a>
// Pour vider le panier
<a href="#" onclick="caddie.getDelete();">Vider le Panier »</a>Voici le code de mes div:
Code : Tout sélectionner
<div id="loading" style="display:none;">Chargement</div>
<div id="caddie" style="visibility:hidden; border:#000 solid 2px;"><div id="txt"></div></div>Je ne trouve pas le pourquoi.
Merci d'avance.