Disabling Check-Boxes Recursively

[Neil]

I am trying to select all the check-boxes of the children in a RAD Tree view when the user checks a parent node and disable the check-boxes of all child nodes.  I have a recursive function that is successfully checking the boxes, but i'm not having much luck in disabling all child check-boxes.  Here is my code:

    <script type="text/javascript" language="JavaScript">
    function UpdateChildrenRecursively(nodes, checked)
    {
       var i;
       for (i=0; i<nodes.get_count(); i++)
       {
           if (checked)
           {
               nodes.getNode(i).check();
           }
           else
           {
               nodes.getNode(i).set_checked(false);
           }

           // if the node has children, call the recursive function
           // then disable the checkboxes for each child
           if (nodes.getNode(i).get_nodes().get_count()> 0)
           {
               UpdateChildrenRecursively(nodes.getNode(i).get_nodes(), checked);
               nodes.getNode(i).get_nodes().disabled = true;
           }
       }
    }
    function clientNodeChecked(sender, eventArgs)
    {
       var childNodes = eventArgs.get_node().get_nodes();
       var isChecked = eventArgs.get_node().get_checked();
       UpdateChildrenRecursively(childNodes, isChecked);
    }
</script>

[Veronica]

Hello Neil,

Actually in the new Q2 Release there is a method get_allNodes() which will get all the child nodes of a node. This will reduce many efforts with the recursion as it is implemented by design. So if you need to disable all the check-boxes of the child nodes you'll need something like this:

function clientNodeChecked(sender, eventArgs) {
            var currentNode = eventArgs.get_node();
            var allNodes = currentNode.get_allNodes();
            for (var i = 0; i < allNodes.length; i++) {
                var node = allNodes[i];
                node.disable();
            }
}

This was easy but there is something more in this requirement. By setting disable() to some node it disables the whole node, not only the checkbox. As there were previous discussions about how to disable only the checkbox you may find the answer in this forum post.

Find the full code in the attached .zip file.

Please let us know if upgrading to the latest version is an option for you.

Kind regards,
Veronica Milcheva
the Telerik team

[Neil]

Veronica:

I am on  Q1 2010 SP2.  Your example doesn't quite do what I need.  As you can see from the attached screenshot, it is only disabling the first child, not disabling children recursively.  And when I uncheck the parent, the child is uncehcked, but remains disabled.

I noticed than in the version I am on, there is a property called, CheckChildNodes.


Regards,
Neil

[Veronica]

Hello Neil,

Please accept my appologies. I misunderstood your scenario until your last post.
I guess you are using the code from this help topic.

To disable or enable the child nodes you need the disable() and enable() method of the RadTreeNode client-side object. Here's the code:

function UpdateAllChildren(nodes, checked) {
            var i;
            for (i = 0; i < nodes.get_count(); i++) {
                if (checked) {
                    nodes.getNode(i).check();
                    nodes.getNode(i).disable();
                }
                else {
                    nodes.getNode(i).set_checked(false);
                    nodes.getNode(i).enable();
                }

                if (nodes.getNode(i).get_nodes().get_count() > 0) {
                    UpdateAllChildren(nodes.getNode(i).get_nodes(), checked);
                }
            }
        }
        function clientNodeChecked(sender, eventArgs) {
            var childNodes = eventArgs.get_node().get_nodes();
            var isChecked = eventArgs.get_node().get_checked();
            UpdateAllChildren(childNodes, isChecked);
        }

Let me know if this is what you want.

Regards,
Veronica Milcheva
the Telerik team

[Neil]

Thanks, that gives me some direction.  Still not 100% though -- If you check and un-check Red (from the example below) then check green, just green is checked, non of its children are checked, but if you un-check it, the children are checked.

• Red
  • Green
    • Blue

[Veronica]

Hello Neil,

Oh, there was something little, but tricky in the code and that's why it didn't work. The problem was in these lines:

else {
                    nodes.getNode(i).set_checked(false);
                    nodes.getNode(i).enable();
                }

If your node is disabled you can not change it's state (checked/unchecked). You'll have to enable the node first and then to uncheck it:

else {
                    nodes.getNode(i).enable();
                    nodes.getNode(i).set_checked(false);
                }

Best Regards,
Veronica Milcheva
the Telerik team