Tree Package

The Tree Package comes with a high performance TreeView control with AJAX support and built-in styles. The object model of the tree is highly refined to let you customize the appearance of every single element and node of the tree.

The Treeview control's design-time functions let you code less and design more right in design time.

• Access commonly used properites easily through the SmartTag.

• The Tree Designer dialog box lets you create the tree structure visually as well as provides convenient accesss to customize the properties of each node.
  

  
  Tree Designer Dialog Box

• Use the Style Designer dialog box to create custom styles for different states and apply them to different nodes in the designer.
  

  
  Style Designer Dialog Box

• Bind to XML/Sitemap DataSources easily during design-time.

• Several built-in Styles let you setup professional looking trees instantly.
  

  
  Built-In Tree Styles

• Easily associate TreeView or individual TreeNodes with custom styles that define the appearance of the nodes for different states.
  

  
  CSS Applied TreeView

• There is support for unique ToolTip for each TreeView node or one for the whole tree.

• Lines indicating the hierarchy can be customized or totally removed.

• Show images to the left as well as right side of the TreeView node.

• Add checkboxes to individual TreeNodes and detect click events on the client or server-side.

Rich animation options for child-node expand and collapse are available.

• Transition Effect

Different transition effects can be applied to the TreeView. These are illustrated below:

• Expand Single Path

Restrict your user to expand a single path in the tree to keep the tree height minimal. In other words, expanding a child-node will collapse all it's siblings.

TreeView comes with built in AJAX support.

• LoadOnDemand:

This popular feature is ideal for large trees. This lets you first load your tree on startup and then load child-nodes on demand from the server through AJAX style callbacks.

• Server-Side Events via Callback:

When the AutoPostBack and EnableCallback options are set all server-side events can be handled via callbacks instead of postbacks.

Server-Side events can be raised for one or more of these user-operations on the tree.

• NodeCheckChanged
• NodeCollapsed
• NodeDropped
• NodeExpanded
• NodeRenamed
• NodeSelected

TreeView provides extensive client-side functionalities. It has an efficient integrated client-side object model enabling anyone to create feature rich content with high user interactivity on a webpage. The TreeView control enables flexible client-side scripting for various node operations like node drag, drop, rename, select, and change of node's check box status.

List of client side events:

• ClientSideOnContextMenu
• ClientSideOnCheckedChange
• ClientSideOnNodeCollapse
• ClientSideOnNodeDragStart
• ClientSideOnNodeDrop
• ClientSideOnNodeExpand
• ClientSideOnNodeMove
• ClientSideOnNodeRename
• ClientSideOnNodeSelect

Expand TreeView functionalities with custom contextmenus for any tree node. Identify menu item clicks either on the client or server-side.

• TreeView Node Drag-and-drop

TreeView supports extensive drag-and-drop features. Nodes can be dragged within the tree or to other trees. Postback/callback events are available for drag-and-drop.

• Drag-and-drop between TreevViews

You can easily extend the capabilities of your site with drag-and-drop between treeviews. Both server-side and client-side events are available for this too.

• Auto-node Expand on Drop

TreeView will automatically expand a collapsed node while hovering over it on node drag.

• Auto scroll while dragging

TreeView will automatically bring hidden nodes into view when the mouse is hovered over the edges of the tree.

• Disable Drag-and-drop on Specific Nodes

Easily restrict drag-and-drop on certain nodes through the DraggingEnabled and DroppingEnabled properties.

TreeView comes with desktop application like convenience with full support for key navigation. Nodes can be expanded, collapsed and traversed using the keyboard.

TreeView supports embedding any ASP.NET control inside a Treeview node.

TreeView allows users to edit a node and the appropriate server-side events will also be generated via postback or callback.

Use the NavigateUrl property to create a link to a specific web page. The browser will be redirected to the embedded URL when the link is clicked.This is ideal for "HelpSystem" like applications.

Create custom combo boxes with TreeView in the drop-down using our Generic Drop-Down control.

TreeView constructs the html using td and a tags such that search engines correctly crawl all the pages of your websites.

You have full control over the default state of a node. It can be set as Expanded or Collapsed and Checked or Unchecked.