Самый простой способ добавить всплывающую подсказку в узел дерева Dojo?

Question

Я видел несколько предложений о том, как добавить всплывающую подсказку в узел дерева Dojo, и некоторые из них, похоже, не работают, а другие заставляют меня задавать другие вопросы ...

Один способ, которым я пытался с ограниченным успехом, состоит в следующем:

var myTree = new dijit.Tree({
                model: treeModel,
                id: "myTree",
                showRoot: false,
                persist: false,
                onClick: function(item){                                                
                    console.log(item.name);
                },
                _onNodeMouseEnter : function(node, evt){
                    var tip = new dijit.Tooltip({
                        label: node.item.name,                      
                        connectId: [node.domNode.id]
                    });
                    }                                                       
                });

Но это странное поведение - создавать всплывающую подсказку только при переходе с узла выше в дереве, и только если вы наводите указатель мыши на раскрытие с верхнего края ...

Во второй попытке я посмотрел на метод onMouseEnter Дерева, но у него нет доступа к элементу данных узла, и поэтому мне пришлось бы пройти через то, что кажется немного логичным, чтобы получить данные элемента ... поиск текущего идентификатора узла с помощью навигации по дереву DOM, а затем поиск этого элемента в магазине? ...

Наконец-то я обнаружил, что в Tree есть метод getTooltip (item), но когда я его настроил:

var myTree = new dijit.Tree({
                model: treeModel,
                id: "myTree",
                showRoot: false,
                persist: false,
                onClick: function(item){                                                
                    console.log(item.Obi_Id);
                },
                getTooltip: function(item){
                    return item.Secondary_Names;
                }
            });

всплывающая подсказка представляет собой обычное всплывающее HTML-окно с заголовком ...

Каков правильный (простой) способ выполнения подсказок додзё на динамических (ленивых) узлах дерева? -robbie

Answer 1

Это самый простой способ!

var myTree = new dijit.Tree({
    model: treeModel,
    id: "myTree",
    showRoot: false,
    persist: false,
    onClick: function(item){                                                
       console.log(item.name);
    },
    _onNodeMouseEnter: function (node,evt) {
       dijit.showTooltip(node.item.name,node.domNode)
    },
    _onNodeMouseLeave: function (node,evt) {
       dijit.hideTooltip(node.domNode);
    },
});

Answer 2

Вы можете просто использовать атрибут getTooltip:

new Tree
({ 
    model: model, 
    getTooltip: function(item) { return "A tooltip!"; }
});

Answer 3

define(["dojo/aspect","dijit/Tree","dijit/Tooltip"] ,function(aspect,dijit_Tree,dijit_Tooltip) {
    var tree=new dijit_Tree({....});

    //dijit.showTooltip dijit.hideTooltip defined in Tooltip.js

    //copied from dndContainer.js:
    // aspect.after(this.tree, "_onNodeMouseEnter", lang.hitch(this, "onMouseOver"), true)

    var ttf_on=function(node,evt){dijit.showTooltip("Rev="+node.item.latestRevision,node.domNode)};

    var ttf_off=function(node,evt){dijit.hideTooltip(node.domNode);};

    aspect.after(tree,"_onNodeMouseEnter",ttf_on,true);
    aspect.after(tree,"_onNodeMouseLeave",ttf_off,true);
}

Answer 4

Вы можете просто использовать событие onMouseOver и привязать к нему всплывающую подсказку Dijit.

    new Tree({ 
        model: model, 
        onMouseOut: function(e){ 
            var node = dijit.getEnclosingWidget(e.target);
            Tooltip.hide(node.labelNode); 
        },
        onMouseOver: function(e) {
            var node = dijit.getEnclosingWidget(e.target);
            Tooltip.show("A tooltip!", node.labelNode);
        }
    }); 

Answer 5

Раньше я не имел удовольствия работать с Tree, но вы пытались создать новую подсказку, используя: http://dojotoolkit.org/reference-guide/dijit/Tooltip.html