TreeView issues with checkboxes and expandable nodes

[David]

Hi

Im noticing some behaviors I was not expecting when using the treeview with checkboxes and expandable nodes. 
Some of it could be my understanding of expectations. 
My sample code is here, it's a hierarchy of users with expandable nodes and checkboxes and it shows what keys have been checked, what keys have been expanded and includes buttons for collapsing and expanding and a search.

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

1. Open the sample, The treeview loads collapsed,
   if i check "User 1", i see it in my list of checked keys (1),
   if i open the "User 1" node using the chevron, i then see more checked keys(1,2,4).  Is this expected behavior ? 
   I would expect after checking "user 1" to see all the keys checked (1,2,3,4) since checkChildren = true. 
   If I expand all then check "User 1" then i do see all the nodes checked (1.2.3.4)

2. Refresh the sample,
   Check "user 1",
    expand the "User 1" node,
    expand the "User 2" node.
    Uncheck user 1",
    collapse the "User 1" node,
    Check user 1",
    expand the "User 1" node, 
    *** now the child nodes are not being checked

3. Refresh the sample, 
     Check "user 1", 
     Click "Expand All" button ... 
     *** now the child nodes are not being checked ....
 

[Svet]

Hi David,

Thank you for reaching out to us.

About point 1, indeed that is the default behavior of the TreeView component. It is caused due to its asynchronous nature. Basically, the parent TreeView nodes don't know about their child nodes unless the parent is expanded.

About point 2, Indeed that is caused by a bug on our side. That is why I logged it within our public GitHub repository where its status can be tracked:

https://github.com/telerik/kendo-angular/issues/2738

I have also updated your account Telerik points for bringing this issue to our attention.

About point 3, the "Expand All" button expands the desired nodes programmatically by passing the desired keys. As the button click is an external event of the TreeView component it doesn't rely on the built-in functionalities of the component. That is why, in order to check the desired keys when clicking the "Expand All" button then the checkeKeys collection should be updated in a similar way as the expandedKeys array is updated.

I hope the provided information helps. Let me know in case further assistance is required for this case.

Regards,
Svetlin
Progress Telerik

[Chris]

Hi, is there a workaround for point 1? In our app it's common to select parent nodes so we don't need to expand the children nodes because they can be too many. Please, let me know if I need to open a support ticket. Thanks.

[Svet]

Hi Chris,

The TreeView parent items are unaware of their children unless they are expanded. Thus, the developer should manually determine the children items upon the selection of a parent item. For the purpose the (selectedKeysChange) of the kendoTreeViewSelectable directive can be handled. If there is a parent selected which also has children then the children can also be added manually to the selectedKeys.

What else could be done is to use some custom implementation for the checkboxes. For the purpose please use a node template in order to add the desired custom checkboxes to each node. That approach allows to control the check/uncheck events of the checkboxes as per the specific use-case scenario and leaves the full control in the hands of the developer.

Regards,
Svetlin
Progress Telerik