RadTreeView exits edit mode autometically on context menu click

4 posts, 1 answers
  1. Manas
    Manas avatar
    5 posts
    Member since:
    Apr 2012

    Posted 27 Apr 2012 Link to this post

    I have a radTreeView like this.

    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
    <telerik:RadTreeView ID="RadTreeView1" CheckBoxes="true" Runat="server"
        OnContextMenuItemClick= "menuClicked" OnClientContextMenuItemClicking="clientMenuClicking"
        OnNodeEdit="RadTreeView1_NodeEdit">
     
    <ContextMenus>
            <telerik:RadTreeViewContextMenu ID="ctxMenuAdd" runat="server">
                <Items>
                    <telerik:RadMenuItem Value="addNode" Text="Add Node">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Value="delNode" Text="Delete Node">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Value="renNode" Text="Rename Node">
                    </telerik:RadMenuItem>                 
                </Items>
             </telerik:RadTreeViewContextMenu>
    </ContextMenus>
     
    </telerik:RadTreeView>
    </telerik:RadAjaxPanel>

    This is the ContextMenuClicking javascript in client side.

    function clientMenuClicking(sender, args)
            {
                var menuItem = args.get_menuItem();
                var treeNode = args.get_node();
                menuItem.get_menu().hide();
     
                switch (menuItem.get_value())
                {
                    case "addNode":
                        var windowResult = window.showModalDialog("newNode.html", "Enter Value", "dialogHeight: 300px; dialogWidth: 300px;");                   
                        document.getElementById("HiddenField1").value = windowResult;
                        break;
                    case "renNode":
                        treeNode.startEdit();                   
                        break;
                }
                             
            }

    finally this is the server side code for onNodeEdit

    protected void RadTreeView1_NodeEdit(object sender, RadTreeNodeEditEventArgs e)
        {
            e.Node.Text = e.Text;
        }

    The problem is, when I right click on the node and select "Rename" the node turns into a text box only for a split second, then it goes back to normal mode.

    It seems when I click the rename option, the client side code is firing and the node is turning into a text box. but then somehow a page postback is occurring which is removing the textbox. 

    How can I get rid of the issue?

  2. Manas
    Manas avatar
    5 posts
    Member since:
    Apr 2012

    Posted 27 Apr 2012 Link to this post

    Also to add, If I make the "Rename" menu item to stop postback by using:

    <telerik:RadMenuItem Value="renNode" Text="Rename Node" PostBack="false">
                        </telerik:RadMenuItem>

    then the text box remains, but since I want the new name in the server side, I cant use this option.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Answer
    Peter
    Admin
    Peter avatar
    6637 posts

    Posted 30 Apr 2012 Link to this post

    Hi Manas,

    Please, refer to the Node Text Editing demo and review the description tab -

    You need to enable the AllowNodeEditing property of RadTreeView to be able to edit the nodes.

    After you have typed the new text, click outside the tree or press the Enter key. The NodeEdit server event will be fired. There, you can change the text of the node, which is being edited.

    So, when you choose the "Rename Node" option from the menu, this action should not cause a postback - you need to remain on the client untill you type in your text and click outside the tree. The workaround that you have used is fine and it does not prevents you from going to the server via the NodEdit server side event.

    All the best,
    Peter
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Marbry
    Marbry avatar
    26 posts
    Member since:
    Aug 2012

    Posted 30 Apr 2012 Link to this post

    You need to keep it from immediately posting back to the server.

    case "renNode":
    args.set_cancel(true);
    treeNode.startEdit();                    
    break;

    Call set_cancel() to keep the server postback from occurring until after the user has entered a value.
Back to Top