How to get selected node level

[KINS]

I have an treeview in blazor application.I would like to know how to get selected node level when I select on node

 protected override void OnInitialized()

    {

        base.OnInitialized();

        treedata.Add(new TreeData { nodeId = "04", nodeText = "Order Management system", iconCss = "icon-th icon", hasChild = true });

        treedata.Add(new TreeData { nodeId = "04-01", nodeText = "Order Receiving", iconCss = "icon-circle-thin icon", hasChild=true, pid = "04" });

        treedata.Add(new TreeData { nodeId = "04-02", nodeText = "SRF", iconCss = "icon-circle-thin icon", pid = "04-01" });

        treedata.Add(new TreeData { nodeId = "04-03", nodeText = "Style Management", iconCss = "icon-circle-thin icon", pid = "04-01" });

        treedata.Add(new TreeData { nodeId = "04-04", nodeText = "Color Management", iconCss = "icon-circle-thin icon", pid = "04-01" });

        treedata.Add(new TreeData { nodeId = "04-05", nodeText = "Buyer Order", iconCss = "icon-circle-thin icon", pid = "04-01" });

        treedata.Add(new TreeData { nodeId = "04-06", nodeText = "Order Processing", iconCss = "icon-circle-thin icon", pid = "04" });

        treedata.Add(new TreeData { nodeId = "04-07", nodeText = "Factory Order", iconCss = "icon-circle-thin icon", pid = "04-06" });

    }

[Sharon Sanchez Selvaraj]

Hi Ahmed, 

 

Greetings from Syncfusion Support. 

 

We have checked with your reported query regarding TreeView. This can be achieved by invoking the script code from the NodeSelected event of TreeView. Refer to the code snippet. 

 

Index.razor 

public void selected(NodeSelectEventArgs args) 

    { 

        jsRuntime.InvokeAsync<string>("getNodeLevel", args.NodeData.Id); 

    } 

Host.cshtml 

    <script> 

        function getNodeLevel(targetNodeId){ 

            console.log(document.querySelector('[data-uid="' + targetNodeId + '"]').getAttribute('aria-level')); 

        } 

    </script> 

 

Refer to the sample. 

 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/TreeView-719561071.zip 

 

Please get back to us if you need any further assistance. 

 

Regards, 

 

Sharon Sanchez S. 

[KINS]

thanks for reply..

how can I get js value (node level value) in razor page.

[Shalini Maragathavel]

Hi Ahmed, 

Thanks for the update.
  

We have validated your query with TreeView. You can achieve your requirement by returning the node level value to the server side(razor) from the script code, which is invoked from the the NodeSelected event of TreeView as demonstrated in the below code snippet,  

 

Index.razor 

  public async Task selected(NodeSelectEventArgs args) 

    { 

       var nodeLevel=await jsRuntime.InvokeAsync<string>("getNodeLevel", args.NodeData.Id); 

        Console.WriteLine(nodeLevel); 

    } 

Host.cshtml 

<script> 

   function getNodeLevel(targetNodeId) { 

         

    var nodelevel = document.querySelector('[data-uid="' + targetNodeId + '"]').getAttribute('aria-level'); 

 

        return nodelevel; 

 

        } 

    </script> 

 

Please find the below sample for your reference, 

  

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/TreeView2138040575.zip 

  

Please get back to us if you need any further assistance.  

  

Regards,  

Shalini M.