Displaying the tooltip as html

[r.an...@gmail.com]

Hi,

Is it possible to display the tooltip as html? If not, JQuery UI has a tooltip widget, can this be used?

Thanks,

[mar10]

Using the jQuery UI tooltip widget is easy:

$("#tree span.fancytree-title").tooltip();

and set the tooltip attribute in the node data

<ul id="treeData" style="display: none;">
    <li id="id1" title="Look, a tool tip!">item1 with key and tooltip

or

[
 {"key": "2", "title": "item1 with key and tooltip", "tooltip": "Look, a tool tip!" },

[r.an...@gmail.com]

Hi,

The tooltip is being displayed, however, the html tags are not being interpreted i.e. it is being displayed as text.

Using $("#tree span.fancytree-title").tooltip(); does not seem to make a difference.

I was looking at the fancytree javascript and I noticed the following at line 2893:

...
if(!nodeTitle){
tooltip = node.tooltip ? " title='" + FT.escapeHtml(node.tooltip) + "'" : "";
...

Is this what may be causing the tooltip to not get displayed properly although JQuery ui tooltip widget is being invoked?

Thanks

[mar10]

Fancytree renders the 'tooltip' property as standard `<span title='...'>` attributes, which most browsers display as tooltip.

I think HTML markup is not allowed in those standard `title` attributes.

You can however add your own data field to the nodes, and make the jQuery tooltip widget use it (by passing the 'contents' callback)

*edit*; opened an issue for this: https://github.com/mar10/fancytree/issues/313

[r.an...@gmail.com]

Hi,

I am trying to use the tooltip content feature as follows, however the tooltip is not being displayed:

fancyTreeNode.myTooltip = { content: "<table> <tr><td> tooltip specific to this node in tree...</table>" };
....

$("#tree span.fancytree-node").tooltip("option", "content", function() {
return this.data.myTooltip; // This line is never triggered in debugger.
});

Thanks