EjDropDownTree in Angular

[Marko]

Hi,

will be this EjDropDownTree component included in any of Angulars products (EJS2 or EJS1)? If not, I wonder if there is now any possibility to implement ejDropDownList with grouping and multiselect in way, that when you click on one group, it selects all of the childrens (like in EjDropDownTree)
E.q.:
-->
Is it possible the same in Grouped EjDropDownList:
-->

Regards,
Marko

[Prince Oliver]

Hi Marko, 

Thank you for contacting Syncfusion forums, 

Currently we have not provided support for Angular ejDropDownTree component in EJ1 and EJ2 platforms. But we can achieve your requirement in the Grouping and Multiselect sample of the DropDownList control. Using the click event handler, we can get the clicked Group header. Then comparing it with the dataSource bound to the control, we can get the index values of the items in that category. Now using the selectedIndices property, we can select the multiple values.  Kindly refer to the following code snippet. 

<script type="text/javascript"> 

       document.addEventListener('click', function (e) { 

           if(e.target.tagName == "LI" && e.target.className == "e-category"){ 

             var category = e.target.innerText; 

                var ddlObj = $('#vegetable').data("ejDropDownList"); 

                var list = ddlObj.getListData(); 

             var indices = []; 

             for(var i=0; i< list.length;i++){ 

                if(list[i].category == category) indices.push(i); 

             } 

             ddlObj.setModel({ selectedIndices: indices }); 

           } 

        }); 

         var target; 

         $(function () { 

              $('#vegetable').ejDropDownList({               

                 width:"150px", 

                dataSource: skillset, 

                fields: { text: "skill" ,category: "category"}, 

                allowGrouping:true, 

                enableloadOnDemand:false, 

                 enableFilterSearch: true , 

                multiSelectMode: ej.MultiSelectMode.VisualMode, 

                showCheckbox: true 

              }); 

         }); 

</script> 

We have prepared a sample for your reference, please refer to the following playground link: https://jsplayground.syncfusion.com/znwys12e  

Regards, 

Prince 

[Marko]

Hi,

thank you for your cod snippet. I was able to mage select to work as I wanted, so I do not need ejDropDownTree.
Thank you again for your help.

Regards,
Marko

[Keerthana Rajendran]

Hi Marko,  

 

Most Welcome. Please get back to us if you need further assistance on this. We will be happy to assist you. 

 

Regards, 

Keerthana.