IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Bibliothèques & Frameworks Discussion :

dijit.Tree avec plusieurs dijit.Menu [Dojo]


Sujet :

Bibliothèques & Frameworks

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre habitué
    Profil pro
    Inscrit en
    Juillet 2007
    Messages
    12
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2007
    Messages : 12
    Par défaut dijit.Tree avec plusieurs dijit.Menu
    Bonjour,
    Je viens vers vous après quelque heures de recherches.
    J'ai un dijit.Tree de la forme :
    Root
    _|_Fournisseurs
    ___|_Lots
    _____|_Articles
    J'arrive sans problème à affecter un dijit.Menu sur ce tree., mais j'aimerais que en fonction du type cliqué (fournisseur, lot, article) un menu contextuel différent s'affiche, quitte à créer trois menus différents.
    Je ne sais pas comment "binder" par 'menu.bindDomNode(tree.domNode)' où tree.domNode serait remplacé soit par les noeuds 'fournisseur' soit 'lot', soit 'article'.
    Je pense qu'il faut faire un dojo.query puis dojo.foreach en fonction du type pour binder seulement sur les noeuds qui m'intéressent aux menus correspondant, mais comment faire pour faire des 'query' dans le tree ?

    Cordialement,
    JB.

  2. #2
    Membre habitué
    Profil pro
    Inscrit en
    Juillet 2007
    Messages
    12
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2007
    Messages : 12
    Par défaut Voilà ou j'en suis.
    J'ai donc pu trouver un bout de code qui m'a aidé:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    treeStore.fetch({
      query: { type: "fournisseur" },
      onItem: function(item, request) {
        dojo.forEach(treeStore.getValues(item, "children"), function(childItem) {
          var itemNode = tree.getNodesByItem(treeModel.getIdentity(childItem));
          console.log(itemNode); 					
          console.log(itemNode[0].domNode); 
          if (childItem.type == "fournisseur") {
            menu.bindDomNode(itemNode[0].domNode);
          }
        });
      }
    });
    Mais celui-ci ne fonctionne pas, j'ai l'impression qu'à partir du moment où on "bind" un domNode du tree, c'est tout le tree qui est pris en compte.

    J'ai aussi essayé ce code là, je bind le domNode parent et unBind tous les enfants, mais ne marche toujours pas.
    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
    tree.onLoad = function () {
      treeStore.fetch({
        query: { type: "fournisseur" },
        onItem: function(item, request) {
          var itemNode = tree.getNodesByItem(treeModel.getIdentity(item));
          console.log(itemNode); 
          console.log(itemNode[0].domNode);
            if (item.type[0] == "fournisseur") {
              menu.bindDomNode(itemNode[0].domNode);
              dojo.forEach(treeStore.getValues(item, "children"), function (child) {
                menu.unBindDomNode(tree.getNodesByItem(treeModel.getIdentity(child))[0].domNode);
              });
            }
        }
      });
    }
    Je n'y comprend plus rien, je ne vois pas ce que je fais de mal.
    Pouvez vous m'aider?
    JB

  3. #3
    Membre habitué
    Profil pro
    Inscrit en
    Juillet 2007
    Messages
    12
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2007
    Messages : 12
    Par défaut Réponse trouvée
    Finalement, c'était tout bête:
    Pas de tree.onLoad(), pas de store.fetch().
    Tout est dans l'implématation de _openMySelf.
    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
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    // connect menu
    dojo.connect(menuFourniseur, "_openMyself", tree, function(e){
      var node = dijit.getEnclosingWidget(e.target);
      if (node.item) {
        var itemInfo = node.item;
        if (!itemInfo.root) {
          var type = itemInfo.type[0];
          switch (type) {
            case 'fournisseur':
              console.debug('fournisseur -> id:'+itemInfo.id[0]);
            break;
            default:
              dijit.byId("left_tree").focusNode(node);
            break;
          }
        } else {
          dijit.byId("left_tree").focusNode(node);
        }
      }
    });
     
     
    dojo.connect(menuLot, "_openMyself", tree, function(e){
      var node = dijit.getEnclosingWidget(e.target);
      if (node.item) {
        var itemInfo = node.item;
        if (!itemInfo.root) {
          var type = itemInfo.type[0];
          switch (type) {
            case 'lot':
              console.debug('lot -> id:'+itemInfo.id[0]);
            break;
            case 'fournisseur':
              dijit.byId('menuFournisseur')._openMyself(e);
            break;
            default:
              dijit.byId("left_tree").focusNode(node);
            break;
          }
        } else {
          dijit.byId("left_tree").focusNode(node);
        }
      }
    });
     
     
    dojo.connect(menuArticle, "_openMyself", tree, function(e){
      var node = dijit.getEnclosingWidget(e.target);
      if (node.item) {
        var itemInfo = node.item;
        if (!itemInfo.root) {
          var type = itemInfo.type[0];
          switch (type) {
            case 'article':
              console.debug('article -> id:'+itemInfo.id[0]);
            break;
            case 'lot':
              dijit.byId('menuLot')._openMyself(e);
            break;
            case 'fournisseur':
              dijit.byId('menuFournisseur')._openMyself(e);
            break;
            default:
              dijit.byId("left_tree").focusNode(node);
            break;
          }
        } else {
          dijit.byId("left_tree").focusNode(node);
        }
      }
    });
    Il ne reste plus qu'à créer un menu par type.

    JB

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [Dojo] drag and drop avec dijit.tree
    Par laminfodev dans le forum Bibliothèques & Frameworks
    Réponses: 2
    Dernier message: 29/01/2010, 13h06
  2. [Dojo] dijit.tree avec dijit.menu
    Par laminfodev dans le forum Bibliothèques & Frameworks
    Réponses: 3
    Dernier message: 22/01/2010, 11h29
  3. [Dojo] dijit.Tree avec de longues lignes
    Par Eric Pasquier dans le forum Bibliothèques & Frameworks
    Réponses: 2
    Dernier message: 10/11/2009, 16h49
  4. menu vertical avec plusieurs colonne
    Par jessicaz dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 19/04/2009, 07h03
  5. menu horizontal avec plusieurs styles
    Par bruman dans le forum Mise en page CSS
    Réponses: 7
    Dernier message: 19/02/2009, 17h39

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo