TreeList.NodeUnHovered

Syntax

NodeUnHovered: function(sender, args);

Parameters

sender. Event source.

args. Information on the event. Available argument: Node - node where the attribute of mouse over is deselected.

Description

The NodeUnHovered event is fired after a tree node is unhovered with the mouse.

Comments

Hovering over a node fires the TreeList.NodeHovered event.

Example

To execute this example, in the HEAD tag add links to component library PP.js and visual style tables PP.css. In the BODY tag add a DIV element with the identifier treelist2. A file named treeImagesIcons.png must be stored at the same level with the page.

var treeList = new PP.Ui.TreeList(
{
    ParentNode: document.getElementById("treelist2"),
    Width: 300,
    Height: 100,
    ImageList: new PP.ImageList(
    {
        Source: "treeImagesIcons.png",
        IconHeight: 20,
        IconWidth: 18
    }),
    Columns: [
    {
        Caption: "Country",
        Width: 100,
        MinWidth: 10
    }],
    Nodes: [
    {
        Text: "Europe",
        Key: "n1",
        Columns: [],
        Nodes: [
        {
            Text: "France",
            Key: "n2",
            Nodes: [
            {
                Text: "Paris",
                Key: "n3"
            }]
        }]
    }]
});
treeList.NodeUnHovered.add(function (sender, args)
{
    treeList.getNodeByKey("n1").expand();
    treeList.getNodeByKey("n1").setImageIndex(1);
    treeList.getNodeByKey("n2").toggle()
    console.log(args)
});

After executing the example the HTML page contains a TreeList component that has a column titled Country and three nodes. When the user hovers the cursor over a node, and then moves cursor to another node, icon of the Europe node changes, and the list of node children is expanded. The toogle method is executed for the node named France: that is, on clicking on the icon of the first node, the list of France node items is expanded or collapsed.

See also:

TreeList