TreeView - Selected nodes not working properly

[adrian]

Hi,

I'm loading the tree nodes remotely and setting up which nodes were selected previously by the user. The problem is that when the tree has inner levels, if a node is selected, all the children (including inner levels) get selected instead of just the ones on the array. Here is my code sample

this.processService.getTree(this.companyCode).subscribe(

            (tree) => {

              this.activitiesTree.fields.dataSource = tree.map((x) => {

                return {

                  code: x.code,

                  name: x.name,

                  active: x.active,

                  parentCode: x.parentCode,

                  type: x.type,

                  hasChild: x.hasChild,

                  expanded: x.hasChild,

                };

              });

              this.activitiesDataSource = this.activitiesTree.fields.dataSource;

              this.surveyService

                .getActivityList(this.companyCode, this.surveyCode)

                .subscribe((activities) => {

                  console.log('activities', activities); // ["1.1.1.1"]

                  this.activityNodesChecked = activities;

                  this.activitiesTree.checkedNodes = activities;

                  this.activitiesTree.refresh();

                  console.log('activities', activities); // ["1.1.1.1", "sp1"] the second id is set automatically, don't know why

                });

            },

            (e) => {

              this.toastr.error(e, 'Error');

            }

          );

The expected result should be

The result I'm getting

[Muthukrishnan Kandasamy]

 

Hi Adrian, 

 

Thanks for contacting Syncfusion support. 

 

We have validated your reported problem in TreeView component. We were unable to reproduce your reported problem in our end the CheckedNodes property working fine. We have prepared sample for your convenience, in this sample we have dynamically checked the tree nodes by using button click event. Please refer to the below link for the sample. 

 

https://stackblitz.com/edit/angular-tree-checked?file=app.component.ts 

 

If your requirement is to prevent children nodes checkboxes checks while checking their parent node’s checkbox, then you can set false for autoCheck of TreeView. It will prevent auto checking functionality of TreeView component. 

 

https://ej2.syncfusion.com/angular/documentation/api/treeview/#autocheck  

 

Also, check out the following link to know how-to customize TreeView component. 

 

If the reported issue still persists, please share some additional details it will be help us to provide you the prompt solution. 

 

1. TreeView component rendering code block with data source binding code.
2. If facing any script error, share the screenshot.
3. If possible, share the issue replicating sample or else replicate your reported issue in the shared sample.
4. Share us the screen recorded video with issue reproducing steps.

 

Please let us know, if you need any further assistance. 

 

Regards, 

Muthukrishnan K