Customize treeview to contain positioned dom nodes

[Roatin Marth]

Is it possible to customize the treeview to position additional DOM content to the far right of a tree node? We are hoping to use a "hover" state for the node to determine when to show/hide said DOM content.

See the attached screenshot. Note the two little icons to the right of the hovered tree node. This is what I'm talking about.

[Alex Gyoshev]

Hello Roatin,

It is possible. In order to achieve the scenario from the screenshot, the first thing you need is to make the treeview items take up the whole row:

.k-treeview span.k-in {
    display: block;
}

For the content on the right, you have two options for creating it:

• on-the-fly, when an item is hovered
• during initialization

Depending on the size of your treeview, you can consider both of these approaches -- for larger treeviews, creating the content when the items are hovered is recommended, since it minimizes the markup on the page. Either way, you can attach a mouseenter and mouseleave event handlers to the .k-in elements, and show / hide the additional content.

Best wishes,
Alex Gyoshev
the Telerik team