We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to set selection to a node by programatically?

Thread ID:

Created:

Updated:

Platform:

Replies:

146880 Aug 23,2019 10:59 AM UTC Aug 29,2019 07:28 AM UTC Angular - EJ 2 5
loading
Tags: Treeview
Rahul V Reji
Asked On August 23, 2019 10:59 AM UTC

I want to set a node as selected on startup as well as when i call certain functions. How do i do this?

This is my tree structure.
I want to set selection using the NodeId.

this.treeFields = {
dataSource: this.data,
id: 'NodeId',
text: 'NodeHeader',
child: 'NodeChild',
};


Thank you.

Ashokkumar Balasubramanian [Syncfusion]
Replied On August 26, 2019 10:02 AM UTC

Hi Rahul V Reji, 
 
Greetings from Syncfusion support. 
 
For this scenario, you can specify the selected attributes value in fields property of TreeView component to achieve it. Please check the below code block. 
 
public countries: Object[] = [ 
        { id: 1, name: 'Australia', hasChild: true, expanded: true }, 
        { id: 2, pid: 1, name: 'New South Wales', isSelected: true } 
]; 
public field: Object = { dataSource: this.countries, id: 'id', parentID: 'pid', text: 'name', hasChildren: 'hasChild', selected: 'isSelected' }; 
 
Also, if you want to specify the selected nodes on certain actions, you can specify the corresponding tree node id’s in selectedNodes property. Please check the below code block. 
 
this.tree.selectedNodes = ['1']; 
 
 
Please check the above sample and get back to us, if you need any further assistance on this. 
 
Regards, 
Ashokkumar B. 


Rahul V Reji
Replied On August 26, 2019 01:14 PM UTC

I am getting this error when i'm trying to use this.tree.selectedNodes = ['1']; .

"ERROR TypeError: Cannot set property 'selectedNodes' of undefined".


I want to keep the first node of my tree selected initially. I am using the following code.

public callTreeAPI(): void {
this.dashboardService.getData()
.subscribe(
(data: any) => {
setTimeout(() => {
this.data = data.Data;
console.log(this.data);
this.initializeTOC();
this.getTreeDataAPI(this.data[0].NodeId);
this.treeView.selectedNodes=[this.data[0].NodeId];
}, 1000);
}, // success path
error => this.error = error // error path
);
}
getTreeDataAPI() takes a nodeId as argument and returns the node details.



Ashokkumar Balasubramanian [Syncfusion]
Replied On August 27, 2019 12:05 PM UTC

Hi Rahul V Reji, 
 
Thank you for providing the code blocks. 
 
The reported problem due to on accessing the TreeView components instance in your mentioned code block. Could you please ensure whether, you are properly creating the component instance in TreeView component and able the access this component instance in mentioned code blocks? 
 
If you are unable to access TreeView component instance in mentioned code block. Please store the TreeView instance in another variable and use that variable to mentioned code block. Please refer the below code block. 
 
    selectNode(){ 
        var treeInstance = this.tree; 
        setTimeout(() => { 
            this.data = this.countries; 
            //If you are unable to access the TreeView instance 
            treeInstance.selectedNodes = [this.data[4].id]; 
        }, 1000); 
    } 
 
 
To know more details about creating instance in Angular, please refer the below documentation. 
 
 
Kindly check the above provided information’s and revert us, if you need any further assistance. 
 
Regards, 
Ashokkumar B. 


Rahul V Reji
Replied On August 28, 2019 01:34 PM UTC

Thanks a lot. It's working now. 
Cheers. :)

Ashokkumar Balasubramanian [Syncfusion]
Replied On August 29, 2019 07:28 AM UTC

Hi Rahul V Reji,  
 
We are glad to hear the problem has been resolved. Please let us know, if you need any further assistance. 
 
Regards, 
Ashokkumar B. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon