Deselect parent node when all children nodes are deselected

[TheAustinG]

I have gone through the documentation and as far as I know this isn't possible but maybe I'm missing something.

I would like to have the ability for the parent checkbox to become unselected when all children checkboxes have been unselected. I would also like to have it become selected if all children are selected.

Sometimes we have users that individually select/unselect all children checkboxes not realizing they can just select/unselect the parent. So in these cases it would be nice to programmatically select/unselect the parent.

[grapoza]

That's a good question. My first thought would be to add a treeNodeSelectedChange handler, but this would only get the checked/unchecked child node without a reliable way to get the parent (there's a parent-id attribute on most nodes, but it's an internal detail and also doesn't exist on root nodes). Until there's a solution for that, the only thing I can think of off the top of my head is to handle the event, and in the handler call the tree's getMatching method and in that function argument return the node that contains the checked child. Definitely not ideal if you have a large data set, since that method will always traverse the whole tree. But in case that works, it'd go something like (excuse my untested pseudocode):

eventHandler(node, event) {
  const isCheckedNode = toCheck => toCheck[toCheck.treeNodeSpec.idProperty] === node[node.treeNodeSpec.idProperty];
  const parentNode = this.$refs.treeRef.getMatching(n=> n[n.treeNodeSpec.childrenProperty].some(isCheckedNode));
}

Meanwhile, this raises a couple of good enhancement ideas I'll throw into the Issues list. I'm currently working on 5.0.0, so it would go into that unless you have a deep need in 4.x for these. I think both would be pretty trivial to implement.

1. Allow short-circuiting the getMatching method.
2. Provide an event like treeNodeChildSelectionChanged to avoid having to search for the parent node

[TheAustinG]

Thank you for the quick reply and potential solution!

This is not something I would desperately need in 4.x so waiting to put it into 5.0.0 works for me. The data set is relatively small so I'm not worried about performance or anything while using the workaround that you suggested. Thanks again!

[grapoza]

Sounds good! I've added the two enhancements I mentioned as #261 and #262, so I'll close this in the meantime. 5.0.0 doesn't really have an expected release timeline yet, as the entire tree structure has become fairly bolted-together-over-time and needs a revamp (especially since it's now Vue 3 and there are a lot of improvements to be made there), and I'm trying to do some abstraction so I can add a TreeGrid component with as much code reuse as possible. I'm always happy to add in little wins like these, though.