Discussion :

[*.Har(d)t]

Salut,

Encore une fois un problème avec Dojo.

Mon problème: J'ai une fonction qui me permet de créer un nouveau noeud dans un Tree.

Code :

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

1
2
3
4
function newFolder(itemParent) {
                treeModel.newItem({id: "1000" , nom: "Nouveau dossier", id_site: "1107"},itemParent);
                store.save();
            }

J'ai mis des paramètres en dur dans newItem pour les tests, mais ces paramètres doivent bien entendu être dynamiques.

Ainsi, l'id doit être le prochain id du champ autoincrémental de ma table.

J'ai donc créé une seconde fonction qui appelle un script PHP via un objet xhrGet.

Mon script retourne bien la valeur attendue.

Code :

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

1
2
3
4
5
6
7
8
9
/* Récupère le prochain id de la table Entite via un fichier PHP appelé en AJAX */
            function getIdEntite() {
                var xhrArgs = {
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text"                 
                  }
                var requete = dojo.xhrGet(xhrArgs);
                return requete;
            }

La valeur de retour de getIdEntite() est un objet.
Après avoir lu la doc, je me suis rendu compte que xhrGet retourne un objet Deferred.

Comment puis-je récupérer la valeur de ma table ?

J'ai essayé ceci:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
/* Récupère le prochain id de la table Entite via un fichier PHP appelé en AJAX */
            function getIdEntite() {
                var xhrArgs = {
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text",
                    load: function(data) {
                        return data;
                    }
                  }
                var requete = dojo.xhrGet(xhrArgs);
            }

sans succès.

Pourtant un alert(data) m'affiche bien la valeur de la base de données.

EDIT
-----

J'ai résolu mon problème, mais d'une manière que je n'aime pas trop.

En gros, j'ai ajouté une textbox sur la page.
Dans le xhrGet, je lance une fonction sur load, qui modifie la value de cette textbox, que je récupère ensuite dans la fonction newFolder.

Ca fonctionne, mais j'aurais préféré ne pas avoir besoin de générer un nouvel élément HTML pour cela et récupérer la valeur dans une variable.

[emmanuel.remy]

Salut *.Har(d)t

Tu as plusieurs solutions:
1) Tu peux faire çà (je garde ta démarche, mais tu peux ensuite adapter pour optimiser ) :

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
 
          function getIdEntite() {
                var xhrArgs = {
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text"                 
                  }
                var requete = dojo.xhrGet(xhrArgs);
                return requete;
           }
 
          var d =getIdentite();
          d.addCallback(
               function(response) {
                    console.log(response);
                    return response;
               }
          );

ou si tu mets tout d'un seul tenant:

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
 
          var d = dojo.xhrGet({
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text",
                    load: function(data) {
                         console.log("réponse:", data);
                         return data;
                    }             
                  });
 
          d.addCallback(
               function(response) {
                    console.log("premier appel réponse:", response);
                    return response;
               }
          );
 
         /* possibilité d'un second callback */ 
         d.addCallback(
               function(response) {
                    console.log("seconde appel réponse:", response);
                    return response;
               }
          );

Un Deferred Object permet d'exécuter de manière asynchrone des fonctions que l'on peut chainer. Tu peux ainsi chainer autant de callback que souhaité, la seule contrainte est de TOUJOURS renvoyer le paramètre response. Cela te permet de segmenter ton code.

2) Quand tu écris

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
            function getIdEntite() {
                var xhrArgs = {
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text",
                    load: function(data) {
                        return data;
                    }
                  }
                var requete = dojo.xhrGet(xhrArgs);
            }

tu as toujours accès à des variables globales donc pourquoi ne pas essayer:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
           var dataTable;
 
           function getIdEntite() {
                var xhrArgs = {
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text",
                    load: function(data) {
                        dataTable = data;
                        return data;
                    }
                  }
                dojo.xhrGet(xhrArgs);
            }

. Si ta fonction getIdEntite() est dans un objet et que tu veux faire référence à this au sein du load, alors attention car le this ne pointera pas alors sur ton objet. Il faut dans ce cas faire ainsi:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
           function getIdEntite() {
                var self = this;
                var xhrArgs = {
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "text",
                    load: function(data) {
                        //manipulation via self et non par this, par ex:
                        self.dataTable = data;
                        return data;
                    }
                  }
                dojo.xhrGet(xhrArgs);
            }

Dans tous les cas tu peux passer par des variables de niveaux supérieur.


Note aussi que tu peux récupérer directement un objet JS dans data si tu renvoies une structure JSON du server, ainsi:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
          dojo.xhrGet({
                    url: "../ajax/getNextIdEntite.php",
                    handleAs: "json",
                    load: function(data) {
                         /* data est alors un objet JS créé d'après la structure 
                             JSON renvoyée par le server */
                         console.log("réponse:", data);
                         return data;
                    }             
                  });

ERE

[*.Har(d)t]

Super, merci beaucoup, je vais étudier tout ça et adapter mon code.

Un Deferred Object permet d'exécuter de manière asynchrone des fonctions que l'on peut chainer. Tu peux ainsi chainer autant de callback que souhaité, la seule contrainte est de TOUJOURS renvoyer le paramètre response. Cela te permet de segmenter ton code.

J'ai une question conne : C'est quoi qu'on appelle un callback précisément ?
Je rencontre beaucoup ce terme dans la doc Dojo, mais je ne sais pas ce qu'il recouvre exactement.

[emmanuel.remy]

Quand tu appelles une fonction qui effectue un traitement asynchrone (ou synchrone d'ailleurs), le principal souci c'est de pouvoir être informé de la fin du traitement (ou de son état d'avancement) et pouvoir alors exécuter différentes tâches. Pour cela, lors de l'appel de la fonction de traitement, on fournit une fonction de callback qui sera appelée par la fonction de traitement une fois le traitement terminé.

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
<html>
  <body>
    <script type="text/javascript">
      //la fonction de callback
      function message(str) { 
        document.write(">> INFO: " + str + " <br>");
      }
 
      function traitement(callback) {
            for (var i=0; i<10; i++) {
                document.write("Job: " + i + " <br>");
                callback("Info Job " + i + " en cours");              
            }
            document.write("***************** <br>");
            callback("Fin du Job");
      }
 
      //Exécution de ta fonction de traitement
      traitement(message);
    </script>
 
  </body>
</html>

Bonne continuation,

ERE

[*.Har(d)t]

Merci pour cette réponse claire, nette et précise, comme d'habitude.