NlsTree Features

Incremental loading (load on demand)

Extremely useful when dealing with large tree. You can for example initially load the first level nodes and then when user select a node, an AJAX request is sent to server to load all its child nodes. This feature greatly improve your application performance since you don't need to load the entire tree and the state still remain.

Render on demand

With this feature enabled, the tree render tree nodes when necessary (expanded) . This is client side performance optimization in addition to Incremental Loading. Render on demand allows you to load large tree very fast.

Load Tree from HTML (UL/LI)

By using HTML structure, search engine will be able to follow all links defined in the tree. You can use your favorite HTML authoring tool to create the structure and with minimal Javacript code to convert it to tree view. The HTML must follows specific format. With this feature, javascript skills is not required to implements the tree.

XML Serialization

You can output XML of the tree (including settings) and send it to server for processing. Included in the package, ASP and PHP example to load tree from database and XML ! .

XML Input

This feature allow you to build tree including settings/options from XML on client side (browser). It also supports adding nodes from XML. This feature only available on browsers that supports XML.

Editable mode

This feature is very useful when you used the tree as configuration or data gathering tools. Just simply click on a node twice and a text box will show up. This behavoiur is exactly the same as the behaviour of tree on Windows Explorer.

Multiple Selection

Multiple selection mode allow you to select multiple nodes using CTRL/SHIFT+Click.

Maintain state between server call

Selected node information is stored in cookie. NLSTree will automatically highlight selected node based on information in the cookie.

Multiple Instance

More than one instance of tree in a single page. Each tree has its own configuration and style.

Frame Targetting

When using the tree in frameset, you can specify the target frame of action when a node clicked and display the page/link in the target frame.

Node Sorting

NLSTree automatically sort tree nodes based on default compare function (compare node text). You can sort the nodes ascending or descending or just leave the nodes unsorted.

Customizable behavior

You can define your own tree behaviour when a node clicked, double clicked, mouse over, mouse enter and mouse out from a node. Just simply define an event handler and then assign it to the tree.

Unlimited level of nodes

You can add unlimited number of nodes and level of nodes as long as the system resources are available.

Context Menu

The tree comes with context menu plug in. You can define global context menu that apply for all nodes. You can also override the global context menu by defining node level context menu. You can put icon and separator in the context menu. The context menu is accessible by clicking mouse right button.

NlsTree also support integration to AddObject NlsMenu Pro. With NlsMenu Pro, you can create multi level context menu. See NlsMenu Professional for detail.

Drag and Drop

One of the most powerful feature in NLSTree is support for tree node drag and drop operation. You can rearrange and reorder tree's nodes by simple drag and drop operation! You can also drag and drop from a tree to another tree or other HTML element in a page. The drag and drop operation is customizeable. You can define you own event when drag and drop node.

Auto scroll and auto expand make it easy when using drag and drop. When dragging node over a target node, wait for about 1 seconds, the target node will be expanded, also when dragging a node to top/bottom area of tree, the tree will scrolls automatically.

Checkboxes

When this feature is on, each tree node will have a checkbox. You can check or uncheck the checkbox. Combine this feature with XML output and editing mode, you can create a very powerful configuration or hierarchical data gathering tools.

NlsTree Pro also supports checkboxes on leaf nodes only option.

Single Node Expand

Allow only one expanded node in a level. When you expand a node, the other nodes at the same level will be collapsed

Single Click to Expand/Collapse

Allow single click to expand and collapse node.

Configurable icons

You can define your own sets of icons to work with the tree. The icon set is global and is applied to each node in the tree. You can override the icon set by specifying special icon for particular node or special node such as trash, my document or others. Changing the icons with your own icons means you have total control of the tree's look and feel.

Configurable styles

The style is configured through external css file. You can configure different style for parent nodes, child nodes, normal nodes and selected node. If you have more than one instances of the tree, you can configure different style for each tree.

Custom Individual Node Style

Custom style for special node. You can specify image, background image or text style to a specific node.

Custom HTML Node

This feature allow you to add any HTML as custom node. It can be table, images, forms elements or any other valid HTML elements. Custom node cannot have child node.

Selection mode

Two options of hilighting selected node, row selection and node selection. Row selection hilight entire node including icons, while node selection only hilight the node caption

Hide Root

Hide tree root node to create multiple root tree effect.

Small size of scripts

compare to the feature the tree offers (~26Kb uncompressed!).

Well documented

NlsTree shipped with a complete documentation to help you to customize the tree to fit into your web application.

NLSTREE PROFESSIONAL