This is a migrated thread and some comments may be shown as answers.

select all second-level's nodes in dropdowntree

3 Answers 223 Views
DropDownTree
This is a migrated thread and some comments may be shown as answers.
Tomasz
Top achievements
Rank 1
Tomasz asked on 30 Mar 2020, 01:22 PM

Hello!

I wonder if there is a possibility to create an option ala "select all", but customize it to selecting only second-level nodes or nodes with specified ids?

3 Answers, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 01 Apr 2020, 01:07 PM

Hello Tomasz,

There is no configuration option that allows setting this behavior, i.e. by design "Check all" checks all items, regardless of their level.

It is possible to use the widget's API to set the root nodes back to unchecked, in the change event handler. See this dojo example: https://dojo.telerik.com/EWeNoXEQ/2

Regards,
Ivan Danchev
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Elisa
Top achievements
Rank 1
Iron
commented on 11 May 2022, 02:14 PM

This example sets the root back to unchecked, which then triggers that all children are unchecked is well. How do you uncheck the parent while leaving the children checked? I tried something like this, but it ends up checking the parent again.

            var dataItem = e.sender.dataItem(e.node);

            if (dataItem.hasChildren && dataItem.checked) {
                debugger
                dataItem.set("checked", false);
                dataItem.Items.forEach(i => i.set("checked", true));
            }
Neli
Telerik team
commented on 13 May 2022, 09:29 AM

Hi Elisa, 

Could you please provide more details about the expected result, as I am not sure I understand the scenario correctly? In the example the root items  -  'root 1' and 'root 2' are actually never checked. When the 'Check all' option is checked only the child items are checked. Having more details will help me to understand the exact requirements better and provide approptiate asistance. 

Looking forward to your reply. 

Regards,

Neli

Elisa
Top achievements
Rank 1
Iron
commented on 13 May 2022, 02:09 PM

In your example, if you click "Check all", it checks child 1 & child 2 of root 1 & root 2, but clicking root 1 or root 2 does nothing. What I would like is to be able to click root 1 and have it check just the children while leaving root 1 unchecked, or even better, while putting the tristate mark "-" on it.

 

Thanks!

Elisa

0
Neli
Telerik team
answered on 17 May 2022, 12:55 PM

Hello Elisa,

What you could try is to handle the check event of the TreeView widgets used inside the DropDownTree. When an item is checked you could find the dataItem and check its hasChidlren property. In case the node has children, you can check them as demonstrated below:

 var dropdowntree =  $("#dropdowntree").data("kendoDropDownTree");
          
          var treeviewSelect = function(e){
            var dataItem = e.sender.dataItem(e.node)
            if(dataItem.hasChildren){
              e.preventDefault()
              for(var i=0; i< dataItem.items.length; i++){
                var ch = dataItem.items[i];   
                dataItem.items[i].set("checked", true);
              }               
            }
          };

    dropdowntree.treeview.bind("check", treeviewSelect);

Here is a Dojo example where the described above is demonstrated.

I hope you will find the provided suggestion helpful for resolving the issue.

Regards,
Neli
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

0
Elisa
Top achievements
Rank 1
Iron
answered on 25 May 2022, 03:18 PM

This works well if checkChildren is not true. What I really need is for the top level to not be selectable but to work as a check all for all of its children. I'm trying to get something like this (3 items selected, not 5).

Martin
Telerik team
commented on 27 May 2022, 01:42 PM

I am afraid that there is no appropriate approach with checkChildren set to false. Still the last example provided by my colleague seems to achieve the desired behaviour. Could you let me know what I am missing? If you select a parent node, it remains unselected while all the children are selected.
Elisa
Top achievements
Rank 1
Iron
commented on 27 May 2022, 02:04 PM

Neli's response is close, but as I mentioned only if checkChildren is false. I want checkChildren true so that the user's can see the hyphen ("-") tristate mark to indicate that the node has children checked.
Ianko
Telerik team
commented on 31 May 2022, 10:41 AM

Hi Elisa, 

Essentially, what is the required difference from using the built-in checkChildren: true behavior - with no customizations? https://dojo.telerik.com/@iankodj/aMizemUj/11

I am asking because the original solution is to use check all to toggle second-level checkboxes only. Which differs from the concept of the checkChildren: true in its core. Do you require the checkbox on the root items only for indication? Also, the hyphen typically means that not all children are selected, but as explained, you want it visible when all children are checked. Can you elaborate more on the exact requirements, differences and expectations?  

Tags
DropDownTree
Asked by
Tomasz
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Neli
Telerik team
Elisa
Top achievements
Rank 1
Iron
Share this question
or