jsTree: lier l'événement keypress sur un nouveau nœud

Question

J'essaye de lier l'événement keypress sur un nouveau nœud depuis le menu contextuel de jsTree. Il semble ajouter écouteur pour chaque nœud est pas si bon idea..Edited selon la suggestion en fonction des commentaires fournis ci-dessous

$(function() { 
     $('#demo').jstree({ 
      ... 
       "contextmenu":{   
        "items": function($node) { 
         var tree = $("#demo").jstree(true); 
         return { 
          "Create": { 
           "separator_before": false, 
           "separator_after": false, 
           "label": "Create", 
           "action": function (obj) { 
            var newNode = createNode($node,tree); 
            //tree.edit(newNode); 

         tree.edit(newNode, null, function (the_node, rename_status) { 

          console.log("status:"+rename_status); 
         }); 
            } 
          } 
          } 
         }; 
        } 
       } 

      }) 
    }); 




function createNode($node,tree) 
    { 
     $newNode = tree.create_node($node); //create new node 
     return $newNode; 
    } 

Answer 1

Le jstree create_node fonctions ne retourne pas un nœud DOM, il retourne une chaîne d'identification, comme a déclaré ici: http://www.jstree.com/api/#/?q=create_node&f=create_node%28[obj,%20node,%20pos,%20callback,%20is_loaded]%29

afin de pouvoir joindre un événement dont vous avez besoin le nœud DOM, donc réécrire votre fonction createNode à ceci:

function createNode($node,tree) { 
    $newNode = tree.create_node($node); //create new node 
    return tree.get_node($newNode, true); 
} 

gardez à l'esprit si vous attachez un gestionnaire comme celui-ci, il sera perdu si le parent de ce nœud est fermé puis ouvert, car jstree ne conserve que les nœuds visibles dans le DOM. Si cela ne vous convient pas, utilisez la délégation d'événements, par exemple en attachant l'événement au conteneur de l'arborescence.

---

Selon les commentaires ci-dessous, une meilleure solution serait d'utiliser la fonction de rappel edit (à condition que vous utilisez jstree v.3.1.1 ou plus tard):

tree.edit(newNode, null, function (the_node, rename_status) { 
    // any custom logic you need 
}) 

---

ici est la démo finale en utilisant le rappel d'édition et v.3.1.1: http://jsfiddle.net/DGAF4/498/

Si vous utilisez une version antérieure OU vous ne vous souciez pas de chat appels ching à rename_node - écouter l'événement rename_node.jstree - c'est la méthode préférée pour réagir aux changements de nom.