Monday, February 8, 2010

Displaying Elements in a tree structure in a web page

The problem statement is how to arrange items in tree structure in a web page

I have googled it and found several open source component. Where we can display the items in a tree.
The below one I found is really handy
http://destroydrop.com/javascripts/tree/
Here we can add dynamically elements using jstl or jsp tags. The advantage is we can add icon the style,color and different functionality to the nodes also. It support multi label hierarchy also
The biggest draw back is if there are more than 2000 nodes it gives error in IE "the script is running very slow. Do you want to abort it ?"
To solve this we can do kind of lazy loading. For first time load only parents and on click of the parents load the children by Ajax.