close

e-office Domino blog

Modified Tree Custom Control

chatFrank van der Linden   8 January 2010 09:31:45
Currently I am involved of building a new website, based on xpages.
For the backend we use the Tree Control of OpenNTF.

It is a very cool control, but I noticed that there was no action binded to a node.
So I modified the Java classes with 2 new parameters, 'link' and 'icon', So you can add to the Tree Control to more Column values to use

Icon parameter
The Icons of the tree are based on stylesheet classes and can be override with javascript
The javascript code will be

Image:Modified Tree Custom Control

It return a stylesheet class, in my case 'PublishIcon' and 'DraftIcon'

And in the stylesheet a added some Icon classes
/*Dojo Tree Icons*/
.PublishIcon{
       background-image:url(page_white_world.png);
}
.DraftIcon{
       background-image:url(page_white_edit.png);


Link
The value of the link parameter you can use in the OnClick event of the node/leaf.

This is my example of the Tree Control

Image:Modified Tree Custom Control


Below is a screenshot of the tree in the browser
Image:Modified Tree Custom Control