Client-side events

RadTreeView  provides a number of client-side events that would allow you to accomplish even the most complicated tasks.

You can attach to the RadTreeView's events by using either the server-side properties or the client-side API.

1. Attaching event handlers via a server-side property
   Each client-side event has a corresponding property, whose name is formed like OnClient[EventName].
   You can set the property to the name of the function to be called when the event occurs.

   <telerik:RadTreeView ID="RadTreeView1" runat="server" OnClientNodeClicking="onNodeClicking" />
   
   <script type="text/javascript">
   	function onNodeClicking(sender, args)
   	{
   		 logEvent("OnClientNodeClicking: " + args.get_node().get_text());
   	}
   </script>
   		

2. Using the client-side API to attach event handlers
   Using the client-side API of RadTreeView allows you to attach multiple event handlers to one event using the standard MS AJAX conventions.

   <script type="text/javascript">
   	function onClickedHandler1()
   	{
   		alert("First handler called");
   	}
   	function onClickedHandler2()
   	{
   		alert("Second handler called");
   	}
   
   	function pageLoad()
   	{
   		var treeView = $find("<%=RadTreeView1.ClientID%>");
   		
   		treeView.add_nodeClicking(onClickedHandler1);
   		treeView.add_nodeClicking(onClickedHandler2);
   	}
   </script>
   

   Another advantage of the client-side API is the possiblity of dynamically detaching certain handlers. You can use the remove_nodeClicking method of the treeview object.
   
   

   <script type="text/javascript">
   	$find(<%=RadTreeView1.ClientID%>).remove_nodeClicking(onClickedHandler1);
   </script>
   

3. Cancelling an event
   The events, whose names end in ing, can be cancelled. You can cancel the event by using the set_cancel method of the event arguments passed to the handler.

   <script type="text/javascript">
   	function onClientNodeClicking(sender, eventArgs)
   	{
   	    eventArgs.set_cancel(true);
   	}
   

Related Resources

• Client-Side Events
• Accessing client changes on the server side
• Getting the Nodes Full Path
• Scrolling to a Node when Page first loads
• Expanding and Collapsing All Nodes
• Expanding Nodes on a Single Click
• Using RadTreeNode Methods Against A Group of Nodes
• Accessing a RadTreeView Embedded in Another Control
• Add HTML templates to the TreeNodes
• Drag and Drop to HTML elements that have no ID
• Expand disabled node
• Changing the text of tree nodes
• Scroll to selected Node after AJAX request
• Scroll to selected Node after MS.NET AJAX request
• Make RadTreeView occupy 100% of the Window height
• Collapse all Nodes on losing focus
• Expand parent Nodes
• Hide TreeView Images
• Expand only one Node per level
• How-to distinguish whether node.get_parent() returns the parent node or the parent treeview
• Implement findNodesByAttribute method
• Set the tooltip of the node with javascript
• Fire doublecilck event when clicking on the node's image
• Refresh nodes added on demand
• AddNodesTo method as best performing solution for creating new or moving existing nodes on the client-side
• Highlight the Drop Target Node when dragging inside a RadTreeView