1. Home
  2. Forum
  3. Blazor
  4. BeginEdit after Adding Node

BeginEdit after Adding Node

I am using the sample provided under:

Treeview > Process the tree node operations using context menu

I am using version 18.3.0.53

Two issues:

1) Incorrect tag name:

<ContextMenuEvents TValue="MenuItem" ItemSelected="MenuSelect"></ContextMenuEvents>
had to be changed to
<MenuEvents TValue="MenuItem" ItemSelected="MenuSelect"></MenuEvents>

No biggie.


2) Attempting to BeginEdit just after adding object to bound List<MenuItem>

    //To add a new node
    void AddNodes()
    {
        string NodeId = "tree_" + this.index.ToString();
        ListData.Add(new EmployeeData
        {
            Id = NodeId,
            Name = "NewItem",
            Pid = this.selectedId
        });
        this.tree.BeginEdit(NodeId);
        this.index = this.index + 1;

    }

The above code was not triggering BeginEdit.

I had to change this method to:

    async Task AddNodes()
    {
        string NodeId = "tree_" + this.index.ToString();
        ListData.Add(new EmployeeData
        {
            Id = NodeId,
            Name = "NewItem",
            Pid = this.selectedId
        });
        // This delay is needed to allow component to re-render
        await Task.Delay(100);
        this.tree.BeginEdit(NodeId);
        this.index = this.index + 1;

    }


Is there a more elegant way to detect when the component has finished processing the addition to ListData?

Cheers,
Neil


1 Reply 1 reply marked as answer
SP Sowmiya Padmanaban Syncfusion Team December 15, 2020 08:42 AM UTC

Hi Neil, 
 
Greetings from Syncfusion support. 
 
Query1- Incorrect tag name: 
 
Sorry for the inconvenience. 
 
Yes. In our Volume 3 release version, we have included some tag changes in ContextMenu component. We will update our documentation and  published it in online documentation site 
 
Refer the below link for release notes. 
 
 
Query2- Attempting to BeginEdit just after adding object to bound List<MenuItem> 
 
In our Volume 3 release, we have provided support dynamic support for datasource property, so you can add/delete the node directly from datasource. 
 
When updating the datasource, it takes some time reflect the changes in the UI. So, you need to add the time delay after the addition of node. 
 
Please, refer the below code snippet. 
 
// To add a new node 
    async Task AddNodes() 
    { 
        // expand the selected node. 
        expandedNodes = new string[] { this.selectedId }; 
        var node = this.tree.GetTreeData(this.selectedId); 
        //check if the node is parent node or child node. 
        if(!node[0].HasChild) 
        { 
            node[0].HasChild = true; 
        } 
        string NodeId = "tree_" + this.index.ToString(); 
        ListData.Add(new EmployeeData 
        { 
            Id = NodeId, 
            Name = "NewItem", 
            Pid = this.selectedId 
        }); 
        await Task.Delay(100); 
        await this.tree.BeginEdit(NodeId); 
        this.index = this.index + 1; 
    } 
 
We have modified our documentation sample for your reference. Please, download the sample from the following link. 
 
 
Refer the below link to know more about the TreeView component. 
 
 
 
 
Please let us know, if you need any further assistance. 
 
Regards,  
Sowmiya.P 


Marked as answer
Loader.
Up arrow icon