 |
NlsTree Professional Demo
NlsTree Professional - Advanced Javascript Tree Control
|
|
|
|
NlsTree Options and Functions
This example shows NlsTree Professional basic options and functions such as maintain state, icon configuration, click behavior, sorting, checkboxes, etc. 
|
|
|
Styles and Multiple Instances
This example shows more NlsTree Professional features including custom node, multiple instances, indentation, selection mode etc.
|
|
|
Context Menu
This example shows NlsTree supports for context menu. Context menu is menu displayed when right clicking on tree node.
NlsTree also provides standard implementation sample of adding, delete, update tree nodes using the context menu.
|
|
|
Drag & Drop
Drag and drop operation within tree. You can drag a node and drop it as child node or adjacent node of target.
|
|
|
More on Drag & Drop
More drag drop sample. This sample shows drag drop between tree and tree to other elements.
|
|
|
Hide Root
NlsTree Professional supports hide root option to create tree with multiple root effect.
|
|
|
Frame Targeting
Open a page in specified target when clicking on tree node. NlsTree supports tree level (applies to all tree nodes) and node level target.
|
|
|
Load from HTML (new)
Load tree from standard HTML structure (ul/li/a tags).
This feature allows you to design tree structure using your favorite html authoring tool and
have the NlsTree Professional convert it to tree view. The html structure remains in the page
for search engine indexing.
|
|
|
Render on Demand (new)
Render on Demand optimizes the tree performance on client side (browser).
With Render on Demand, the tree renders the html structure of the tree nodes when user click to expand a node.
This feature greatly improves the speed and performance of the tree when working with large data.
|
|
|
XML Functions
|
Load from XML File/String (client side)
Load tree from XML file or string using browser XML functions.
Most of popular browser now supports XML function. You can use the XML string produced by NlsTree Professional to reconstruct the tree view.
You can also add nodes to existing tree using XML.
|
|
|
XML Serialization
NlsTree Professional suppports XML serialization. You can output complete XML string that represent
the structure of the tree and all its settings/configurations. You also output the xml for specific node only.
|
|
|
Database Examples (PHP - ASP examples are also provided.)
|
Load Tree from Database
This example loads tree from database records.
|
|
|
Load from XML (Server side)
This example loads tree from XML file. Server side script loads and parses XML file and construct the tree.
|
|
|
Incremental Loading (Load on Demand) (updated)
Loads tree nodes on demand asynchronously (AJAX), ie. loads child nodes when a node is expanded.
A request is sent to server when user expand a node, server side script loads and constructs child nodes structure in XML (or javascript).
The XML (or javascript) then is sent back to client, parsed and attached to a node.
This feature allows you to work with large tree data, virtually unlimited.
NlsTree provides 2 AJAX techniques to loads the child nodes asynchronously (click to view the example):
Incremental Loading and maintain state using cookie:
|
|
|
Save Tree to Database
Save changes made on tree (drag & drop, edit node text) to database using AJAX.
Creates, updates and deletes nodes.
Note that save tree demo available upon request. Please contact our support (support@addobject.com) for demo link.
|
|
|
|
