The example given below uses the NodeContextClick and NodeEdit events in conjunction with client-side script to enable the requested functionality.
The result is:
After clicking the item with text Create from the context menu of a random treeview node, a node with text default will be added as last root node in the treeview structure and will be in edit mode. The changes in the text made by the user are reflected in the NodeEdit event handler. Review the code snippet below for further details:
Example:
| ASPX |
Copy Code |
|
<script language="javascript"> function HightlightNode(text) { var node = RadTreeView1.FindNodeByValue(text); if (node != null) { node.StartEdit(); } } </script> |
| C# |
Copy Code |
|
protected Telerik.WebControls.RadTreeView RadTreeView1;
private void RadTreeView1_NodeContextClick(object o, Telerik.WebControls.RadTreeNodeEventArgs e) { if(e.ContextMenuItemText == "Create") { AddNode(e); } }
private void AddNode(RadTreeNodeEventArgs e) { RadTreeNode newNode = new RadTreeNode(); newNode.Value = System.Guid.NewGuid().ToString(); newNode.Text = "default"; newNode.EditEnabled = true; RadTreeView1.Nodes.Add(newNode);
string strScript = "<script>HightlightNode(\"" + newNode.Value+ "\")</script>"; RegisterStartupScript("ScriptKey", strScript); //if you are using RadAjaxManager, the above two lines should be replaced with: //string script = "HightlightNode(\"" + newNode.Value+ "\")"; //this.RadAjaxManager.ResponseScripts.Add(script); }
private void RadTreeView1_NodeEdit(object o, Telerik.WebControls.RadTreeNodeEventArgs e) { RadTreeNode edited = e.NodeEdited; edited.Text = e.NewText.ToString(); } |
| Tree XML Content File |
Copy Code |
|
<Tree> <Node Text="Europe" ContextMenuName = "Actions"> <Node Text="England" ContextMenuName = "Actions"> <Node Text="London" ContextMenuName = "Actions"/> <Node Text="Liverpool" ContextMenuName = "Actions"/> <Node Text="Leeds" ContextMenuName = "Actions"/> <Node Text="Manchester" ContextMenuName = "Actions"/> </Node> <Node Text="France" ContextMenuName = "Actions"> <Node Text="Paris" ContextMenuName = "Actions"/> <Node Text="Cannes" ContextMenuName = "Actions"/> <Node Text="Grenoble" ContextMenuName = "Actions"/> <Node Text="Toulouse" ContextMenuName = "Actions"/> </Node> <Node Text="Germany" ContextMenuName = "Actions"> <Node Text="Berlin" ContextMenuName = "Actions"/> <Node Text="Bonn" ContextMenuName = "Actions"/> <Node Text="Bremen" ContextMenuName = "Actions"/> <Node Text="Munich" ContextMenuName = "Actions"/> </Node> </Node> </Tree> |
| ContextMenu XML Content File |
Copy Code |
|
<ContextMenus> <Menu Name="Actions"> <Item Text="Select" PostBack = "True" /> <Item Text="Edit" PostBack="True" /> <Item Text="Create" PostBack="True" /> </Menu> <ContextMenus> |