Discussion :

[majong]

bonjour, j'aimerais appeler les fonctions f1(parametre),f2(parametre),...
avec prototype.js quelqu'un a t-il une idée ? (chaq fonction fait une requete ajax en utilisant prototype.js)

J'ai essayé: window.onload = function () {...} mais cela ne marche pas toujours, cela depend du temps d'execution de chaq fonction. A mon avis il faut attendre l'execution de chaq fonction. Mais je ne sais pas comment faire ? http://dcabasson.developpez.com/arti...ototype-1.4.0/ ne soulève pas le problème !

[gwyohm]

Salut,

Ta question concerne l'execution de plusieurs fonctions au load de la page ou l'enchainement de fonctions AJAX ? Ou les 2 ?

Détecter le load (par exemple, on peut faire de différentes facons)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
Event.observe(window, "load", function() {
  f1(params);
  f2(params);
});

Pour enchainer les appels AJAX, (si tu dois attendre le resultat d'une requete AJAX avant d'envoyer la deuxieme), il faut passer par les callback :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
function f1(params) {
  new Ajax.request("url", {
    parameters: params, 
    onSuccess: function(response) {
      f2();
    }
  });
}
 
function f2() {
// ...
}

[majong]

(enchainement)
Il n'a t-il pas un proceder par prototype pour le faire automatiquement (du genre il met dans une pile d'appel ?).

Autre exemple, lorsqu'un utilisateur clique et n'attend pas la reponse, une 2° fonction peut etre appelée donc je ne pourrais pas savoir qui s'appelle qui !

[gwyohm]

Il n'a t-il pas un proceder par prototype pour le faire automatiquement (du genre il met dans une pile d'appel ?).

Non, à moins de te créer ta propre classe :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
var AjaxStack = Class.create(  {
  initialize : function() {
   this.ajaxCalls = [];
  },
  push : function(url, params) {
   this.ajaxCalls.push({url: url, params: params}) ;
  },
  run : function() {
   var ajaxOpts = this.ajaxCalls.shift();
   if(ajaxOpts) {
     new Ajax.Request(ajaxOpts.url, {
      parameters: ajaxOpts.params,
      onSuccess: this.run.bind(this),
      onFailure:function() {alert("Erreur: " + ajaxOpts.url);}
     });
   }
 }
}  );
 
// ...
 
var ajaxStack = new AjaxStack();
ajaxStack.push("/une/url", {foo:"bar"});
ajaxStack.push("/une/autre/url", {jambon:"fromage"});
ajaxStack.run();

Autre exemple, lorsqu'un utilisateur click et n'attend pas la reponse, une 2° fonction peut etre appelée donc je ne pourrais pas savoir qui s'appelle qui !

Je ne comprends pas le "qui s'appelle qui "

EDIT : exemple non testé

[majong]

interressant, comment alors appeler mafonction (qui dépend de mes parametres) dans onsuccess ? (en faite, f1 appelle success_f1(reponse) en cas de succes, f2 appelle success_f2(reponse) en cas de succes)

(this.run.bind(this) ???)


Autrement dit que devient les traitements d'appel de f1 en cas de succes ?

[gwyohm]

interressant, comment alors appeler mafonction (qui dépend de mes parametres) dans onsuccess ? (en faite, f1 appelle success_f1(reponse) en cas de succes, f2 appelle success_f2(reponse) en cas de succes)

Presque rien à changer : la response est envoyé à run aux appels suivants...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var AjaxStack = Class.create(  {
  // ...
  run : function(response) {
   var ajaxOpts = this.ajaxCalls.shift();
   if(ajaxOpts) {
     if(response) {
       // faire quelque chose avec response
     }
     new Ajax.Request(ajaxOpts.url, {
      parameters: ajaxOpts.params,
      onSuccess: this.run.bind(this),
      onFailure:function() {alert("Erreur: " + ajaxOpts.url);}
     });
   }
 }
}  );
 
// ...

(this.run.bind(this) ???)

C'est pcq le callback est une fonction anonyme, en faisant un bind, on spécifie qui sera son contexte; dans notre cas on veut this comme this