This is a migrated thread and some comments may be shown as answers.

[Solved] BUG: OnClientNodeEdited and .get_nodes().remove(node)

6 Answers 146 Views

TreeView

This is a migrated thread and some comments may be shown as answers.

Aleksandar asked on 10 Oct 2008, 01:16 AM

After few hours of troubleshooting, figured out that OnClientNodeEdited is too early for removing node with .get_nodes().remove(node).
The code is as follows:
ASPX:

    
            <%@ Page Language="VB" AutoEventWireup="false"   
        
            CodeFile="tempPage.aspx.vb" Inherits="tempPage" %> 
        
            <%@ Register Assembly="Telerik.Web.UI"   
        
            Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head> <title>Test Page</title></head>  
        
            <body> 
        
            <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">  
        
                <script type="text/javascript">  
        
                    function FinishEditing(sender, eventArgs)  
        
                        {  
        
                            var node = eventArgs.get_node();  
        
                            var nodenodeParent=node.get_parent();  
        
                            nodeParent.get_nodes().remove(node);  
        
                        }  
        
                    function FolderContextClicked(sender, eventArgs)  
        
                        {  
        
                            var node=eventArgs.get_node();  
        
                            node.startEdit()  
        
                        }  
        
                </script> 
        
            </telerik:RadCodeBlock> 
        
            <form id="form1" runat="server">  
        
                <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
        
                </telerik:RadScriptManager> 
        
             <telerik:RadTreeView ID="FolderView" runat="server"   
        
                AllowNodeEditing="true"   
        
                OnClientNodeEdited="FinishEditing" 
        
                MultipleSelect="false" ShowLineImages="true"   
        
                OnClientContextMenuItemClicked="FolderContextClicked"   
        
                Skin="Outlook">  
        
                <CollapseAnimation Duration="100" Type="OutQuint" /> 
        
                <ExpandAnimation Duration="100" /> 
        
                <ContextMenus> 
        
                <telerik:RadTreeViewContextMenu   
        
                 ID="FolderContextMenuForJunk" Skin="Outlook">  
        
                <Items> 
        
                    <telerik:RadMenuItem Text="Edit"   
        
                     Value="Edit"></telerik:RadMenuItem> 
        
                </Items> 
        
                </telerik:RadTreeViewContextMenu> 
        
                </ContextMenus> 
        
            </telerik:RadTreeView> 
        
            </form> 
        
            </body> 
        
            </html>

VB:

    
            Imports System.Data.SqlClient  
        
            Imports System.Data  
        
            Partial Class tempPage  
        
                Inherits System.Web.UI.Page  
        
                Protected Sub Page_Load(ByVal sender As Object, _  
        
                  ByVal e As System.EventArgs) Handles Me.Load  
        
              Dim objNode As New Telerik.Web.UI.RadTreeNode("One", "One")  
        
              FolderView.Nodes.Add(objNode)  
        
              objNode = New Telerik.Web.UI.RadTreeNode("Two", "Two")  
        
              FolderView.Nodes.Add(objNode)  
        
              objNode = New Telerik.Web.UI.RadTreeNode("Three", "Three")  
        
              FolderView.Nodes.Add(objNode)  
        
                End Sub  
        
            End Class

If something is called "OnClientNodeEdited " one expects that all work is finished and no problem for remove should exists. But, it is not that way.
Partial fix is replacing remove line with:

    
            window.setTimeout(function() {   
        
            nodeParent.get_nodes().remove(node);}, 200);

But propper fix would be altering TreeView class and making sure when this event fires up, actions like remove are possible.

Alex

6 Answers, 1 is accepted

answered on 03 Aug 2009, 06:32 AM

Greetings,

Been troubleshooting this all day, and I finally keyed in the proper search terms to stumble across this thread ... and thank you, Alex, for posting, as this has been driving me nuts!

So, I am using Q2 2009, and I am getting the same results for using .get_nodes().remove(node). Alex is correct, as I made the assumption that an event name "OnClientNodeEdited" indicates that editing has completed and that I should be able to remove a node if the tree is available. To test that the tree is available, I set an alert('node count = ' + tree.get_nodes().get_count()) inside my ClientNodeEdited event handler, and it yields the correct # of nodes every time, but it throws a js error when I attempt a .remove(node) action in this event; the error is " 'this.get_treeView()' is null or not an object ".

Will this be corrected, or am I just missing the concept behind when .remove(node) is allowed?

Thanks in advance!

answered on 06 Aug 2009, 05:17 AM

Greetings Veselin,

Thanks for the response.

In the current application we're building, we have a radTreeView used to list categories at the top level, each of which contains pages in the second level, each page of which contains content items at the third level (consistently, each type of item at levels 0, 1, and 2). A context menu for each category node has the option to add a "new category". When clicked, a new node (category) appears in edit mode with text set to be empty. If the user enters a name for the category, it's posted back (for storing to the database) and displays on the tree; if the users click away from the node, having entered nothing, the node is removed (with no postback, as it's not necessary). The .remove() method would be the obvious choice here, and Alex's solution works; however, as Alex pointed out, the proper way for this to work would seem to be to leave out the timeout, and the .remove() method to work as expected.

This example coupled with Alex's examples show that there is definitely an appropriate need for this functionality, where expected, as it provides a way for us to offer ease of use and tidy organization of the categories, in this case, by tying up loose ends based on the user's interaction.

If using .remove() within the OnClientNodeEdited event is not the appropriate way to handle, how might you guys handle this given the above-mentioned scenario?