Disabling Check-Boxes Recursively

6 posts, 0 answers
  1. Neil
    Neil avatar
    50 posts
    Member since:
    Mar 2009

    Posted 13 Jul 2010 Link to this post

    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>

  2. Veronica
    Admin
    Veronica avatar
    1213 posts

    Posted 16 Jul 2010 Link to this post

    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
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Neil
    Neil avatar
    50 posts
    Member since:
    Mar 2009

    Posted 16 Jul 2010 Link to this post

    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
  4. Veronica
    Admin
    Veronica avatar
    1213 posts

    Posted 22 Jul 2010 Link to this post

    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
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  5. Neil
    Neil avatar
    50 posts
    Member since:
    Mar 2009

    Posted 22 Jul 2010 Link to this post

    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
  6. Veronica
    Admin
    Veronica avatar
    1213 posts

    Posted 28 Jul 2010 Link to this post

    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
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top