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

edit node not generating a ClientOperation

1 Answer 110 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Tom Parks
Top achievements
Rank 1
Tom Parks asked on 23 Dec 2008, 06:22 PM
I am using the Q3 2008 version of Telerik RadControls for ASP.NET AJAX treeview.  I want to do most of my add, move, delete and edit logic on the clientside, then when the user is done they hit a SAVE button and i'll persist the changes on the Server/DB.

This is working fine for add and remove.  But when I edit a node, no ClientOperation appears for this on the server side.  I should note I'm using a context menu for the edit and delete of nodes.

Some of my code:

The treeview .aspx

<telerik:RadTreeView ID="tvwENB" runat="server" EnableDragAndDrop="true"   EnableDragAndDropBetweenNodes="true" 
                    AllowNodeEditing="true" OnClientNodeDropping="onNodeDropping" OnClientContextMenuItemClicked="onClientContextMenuItemClicked"
                     <ContextMenus> 
                        <telerik:RadTreeViewContextMenu Skin="Outlook" ID="MainContextMenu" runat="server"
                            <Items> 
                                <telerik:RadMenuItem Value="Edit" Text="Edit ..." ImageUrl="~/imgs/pencil.gif" PostBack="false" ></telerik:RadMenuItem> 
                                <telerik:RadMenuItem Value="Delete" Text="Delete ..." ImageUrl="~/imgs/setup/delete.png" PostBack="false"></telerik:RadMenuItem> 
                            </Items> 
                        </telerik:RadTreeViewContextMenu> 
                    </ContextMenus> 
                </telerik:RadTreeView> 


The Javascript for my EditNode method...
function onClientContextMenuItemClicked(sender, args) 
    var menuItem = args.get_menuItem(); 
    var treeNode = args.get_node(); 
 
    switch(menuItem.get_value()) 
    { 
        case "Delete":    
            RemoveNode(treeNode); 
            break; 
        case "Edit": 
            EditNode(treeNode); 
            break; 
    } 
 
function EditNode(node) 
    var treeView = $find("ctl00_MP_tvwENB"); 
    treeView.trackChanges(); 
    node.get_treeView()._startEdit(node); 
    treeView.commitChanges(); 
 
function RemoveNode(node) 
    var treeView = $find("ctl00_MP_tvwENB"); 
    var parentNode = node.get_parent(); 
    treeView.trackChanges(); 
    parentNode.get_nodes().remove(node); 
    treeView.commitChanges(); 

The code for the Remove works fine, removing the node from the screen and generating a remove operation type on the server.  The edit does not however generate the expected change operation.  The text of the edited node does change on the screen.  How to get this to work?



1 Answer, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 26 Dec 2008, 08:39 AM
Hi Tom Parks,

The editing operation does not finish when you call _startEdit that's why it is not recorded as a client-side operation. To do so please subscribe to the editing and edited client-side events and call trackChanges/commitChanges there. Here is a sample implementation:
            <script type="text/javascript">
                function onClientContextMenuItemClicked (sender, args)
                {
                    var node = args.get_node();
                    node.startEdit();
                }
               
                function nodeEditing(sender, args)
                {
                    sender.trackChanges();
                }
               
                function nodeEdited(sender, args)
                {
                    sender.commitChanges();
                }
            </script>
            <telerik:RadTreeView ID="tvwENB" runat="server" EnableDragAndDrop="true" EnableDragAndDropBetweenNodes="true"
                AllowNodeEditing="true"  OnClientContextMenuItemClicked="onClientContextMenuItemClicked" OnClientNodeEditing="nodeEditing" OnClientNodeEdited="nodeEdited">
                <ContextMenus>
                    <telerik:RadTreeViewContextMenu Skin="Outlook" ID="MainContextMenu" runat="server">
                        <Items>
                            <telerik:RadMenuItem Value="Edit" Text="Edit ..." >
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem Value="Delete" Text="Delete ..." >
                            </telerik:RadMenuItem>
                        </Items>
                    </telerik:RadTreeViewContextMenu>
                </ContextMenus>
                <Nodes>
                    <telerik:RadTreeNode Text="Root" Expanded="True">
                        <Nodes>
                            <telerik:RadTreeNode Text="Child"></telerik:RadTreeNode>
                        </Nodes>
                    </telerik:RadTreeNode>
                </Nodes>
            </telerik:RadTreeView>
All the best,
Albert
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
TreeView
Asked by
Tom Parks
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
Share this question
or