Forums : Xul, Xbl, JS...

Aller à la discussion : Plus récente Plus ancienne

# [Résolu] XMLHttpRequest - callback on ready state

Envoyé par : golgoth14

Date : 25/01/2006 10:41

Bonjour,

Je développe sous Firefox 1.5.

Voici le code "simplifié" suivant (vous pouvez simplement le copier-coller dans un script de test) :

function Controller() {
	this.url = "http://localhost:8080/profil/cmd";
	this.xmlHttpRequest = new XMLHttpRequest();
	this.callbackFunction = null;
}

Controller.prototype.setCallbackFunction = function(callbackFunction) {
	this.callbackFunction = callbackFunction;
}

Controller.prototype.__callbackFunction__ = function() {
	alert(this);
	if (this.callbackFunction != null) {
		this.callbackFunction(this);
	}
}

Controller.prototype.send = function() {
	var async = (this.callbackFunction != null);
	this.xmlHttpRequest.open("POST", this.url, async, null, null);
	if (async) {
		this.xmlHttpRequest.onreadystatechange = this.__callbackFunction__;
	} else {
		this.xmlHttpRequest.onreadystatechange = null;
	}
	this.xmlHttpRequest.send(null);
}

function cmdSend() {
	var ctrl = new Controller();
	
	ctrl.setCallbackFunction(callback);
	ctrl.send();
}

function callback(ctrl) {
	// The controller as argument
	alert("callback");

L'objet XMLHttpRequest est initialisé en mode asynchrone avec la fonction this.callbackFunction qui est un membre de l'objet Controller.

Lors de l'exécution, la fonction de callback est bien appelée mais je n'ai pas accès aux membres de l'objet Controller.

En fait, le code "alert(this)" affiche la fonction elle-même au lieu de l'objet Controller !

D'après vous, est-ce normal ?

Si oui, voyez-vous comment je pourrai récupérer l'instance du Controller dans la fonction de callback sans déclarer de variables globale ?

Si non, quel pourrait être le problème ?

Merci d'avance.

Stéphane

# Re: XMLHttpRequest - callback on ready state

Envoyé par : Amaury

Date : 28/01/2006 01:15

Oui, je pense que c'est normal. Et j'utilise effectivement une variable globale, qui me permet de "retrouver" l'objet principal depuis la fonction de callback. C'est pas le plus joli, mais ça fonctionne.

J'ai un peu la même chose avec la création de connexions vers des objets SOAP.

# Re: XMLHttpRequest - callback on ready state

Envoyé par : hhf

Date : 28/01/2006 02:58

c'est tout a fait normal, si tu regarde bien dans ton code, tu fais :

	this.xmlHttpRequest.onreadystatechange = this.__callbackFunction__;

mais onreadystate est une 'propriete' de xmlHttpRequest. Donc tu 'surcharge' une propriete de cette objet, il est donc normal que le mot clé 'this' utilisé dans une methode de xmlHttpRequest, te renvois l'objet xmlHttpRequest lui meme...

pour remedié à ce probleme, j'ai aussi crée un objet pour simplifié les xmlHttpRequest, il a 4 methodes, 2 public et 2 privates. Je te resume, J'ai pas le code ici...

une methode traite le fichier xml de facon generic, dans le cas ou ya eu des erreurs géré par le server(la racine du fichier xml a l'attribut ok="false"). Il est possible de personnalisé cette methode, mais dans la plupart des cas elle convient. Elle dump les messages d'erreur et informe l'utilisateur qu'un probleme est survenue

la methode principale s'apelle askXmlFile() prend de 2, 3 ou 4 arguments. arg1 : l'url; arg2 : les parametres arg3 : la fonction qui recoit le fichier xml si tout c'est bien passé. arg4 : la fonction qui recoit le fichier xml si tout le server a rencontré des erreur que tu as geré.

si ya 2 argument, elle retourne le resultat de la methode _syncAskXmlFile, qui elle même retourne false, si ya eu un PB ou retourne req.responseXML.documentElement.

si ya 3 ou 4 argument, elle retourne rien, appelle la methode _asyncAskXmlFile.qui si tous ce passe bien, passe le req.responseXML.documentElement a la function passé en argument 3 si l'attribut de la racine du file xml est a false alors elle passe le req.responseXML.documentElement a la function passé en argument 4

ca ressemble à ca (de tete):

controller = {
 askXmlFile : function(url, params, funcOnOk, funcOnError) {
  if(funcOnOk!=null) _asyncAskXmlFile(url, params, funcOnOk, funcOnError);
  else return _syncAskXmlFile(url, params);
  return null;
 },
 _syncAskXmlFile : function(url, params) {
  var req = new xmlHttpRequest();   
  req.open("POST",url, false);
  req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  req.send(params);   
  if (req.status=="200") {
    try {
      return req.responseXML.documentElement;
    } catch(e) {
      dump(req.responseText+"\n");
    }
  } else {
    dump(req.responseText+"\n");
    return false;
  }
},
 _asyncAskXmlFile : function(url, params, funcOnOk, funcOnError) {
   req = new XMLHttpRequest();
   req.open("POST", url, true);
   req.onreadystatechange = function () {
     if (req.readyState==4) {
       if(req.status==200) {
         var xmlFile = req.responseXML.documentElement;
         var ok = eval(xmlFile.getAttribute("ok"));
         if(ok) funcOnOk(xmlFile);
         else funcOnError(xmlFile);
       } else alert("une erreur serveur est survenue");
     }
   };
   req.send(params);
 },
 errorFunction : function(xmlFile) {
   alert(xmlFile.getElementByTagName("error")[0].textContent);
 }
}

Bon voila en esperant que ca te donne des idees, soit clement, j'ai fait ca vite fait, mon objet est plus peaufiné, entre autre au niveau des gestion des erreurs.

# [Résolu] XMLHttpRequest - callback on ready state

Envoyé par : golgoth14

Date : 31/01/2006 08:48

Merci à tous.

Je me suis fait avoir avec "this"... une erreur de débutant :)

Il n'est plus possible de poster des messages dans ce forum.