Ejautocomplete with EjListbox

[Breno Rodrigues de Moura]

I want know if it is possible merge functions from ejautocomplete like multiselect, grouping by, search and functions from ejListbox, like showcheckbox and select all itens above one subcategory that are grouped.

Attachment: autocompletePlusListbox_d6ac0019.zip

[Selvamani Sankarappan]

Hi Breno,  

Thanks for contacting Syncfusion support.  

We have checked your provided screen shot. We suggest you to use DropDownList control to achieve your requirement. By using the DropDownList control, you can select single or multiple items from the popup list. Also, we have provided more features such as search, grouping, sorting, adding checkbox to the list items in the DropDownList control.  

Please find the getting started and overview of DropDownList component in the following link:  

https://help.syncfusion.com/js/dropdownlist/dropdownlist  

We have prepared the sample based on your requirement and it is available under the following link:  

Sample Link: http://jsplayground.syncfusion.com/nsodtepb   

In the above sample, we have achieved the grouping by using the “allowGrouping” property and searching has been achieved by the “enableFilterSearch” property. Please find the documentation link for the same:  

https://help.syncfusion.com/js/dropdownlist/functionalities#grouping  

https://help.syncfusion.com/js/dropdownlist/functionalities#search  

Also, we have added the check box to the DropDownList items as shown in the below documentation link:  

https://help.syncfusion.com/js/dropdownlist/howto#add-check-all-option-in-popup-list  

To know more details about properties, methods and events of DropDownList Component, please go through the following API link:  

https://help.syncfusion.com/api/js/ejdropdownlist  

 

Regards, 

Selvamani S. 

[Breno Rodrigues de Moura]

Hi Selvamani S.,

Thanks for your quickly reply, help me a lot, just more one thing, how can i select all itens from one category like select all itens belonging group 1, it is possible? Thanks a lot again!

[Kasithangam C]

Hi Breno, 

Thanks for you update. 

We don’t have support to checkbox for grouping headers inbuilt but we can achieve your requirement (“select all item’s from one category like select all item’s belonging group 1”) through workaround solution. Please find the sample under the following link: 

Sample link: http://jsplayground.syncfusion.com/a1e2ewdv 

In this above sample, we have appended checkbox to the category element(Group 1,Group2,Group 3) in the create of DropDownList as shown below code: 

<code> 

function create(args){ 

              obj=$("#dropdown").ejDropDownList("instance"); 

              CategoryLen=obj.ultag.find(".e-category"); 

               

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

                {  

                 var checkEle='<input type="checkbox" id="'+$(CategoryLen[i]).text()+'" class="e-check-input-category">'; 

                  $(CategoryLen[i]).append(checkEle); 

                } 

                $(".e-check-input-category").ejCheckBox({ change:"OnChange" }); 

              } 

</code> 

Regards, 

Kasithangam 

[Breno Rodrigues de Moura]

Hi Kasithangam C.,

Thanks a lot for quickly reply, you are awesome , that help me a lot, thanks again!

[Breno Rodrigues de Moura]

Sorry for importuning, but I was testing and the checkbox of grouping header dissapear when I do some search, I have to implement some event? And I like to know if it is possible, make search by the grouping header and collapsing it by grouping header, thanks a lot again!

[Kasithangam C]

Hi Breno, 

Sorry for the inconvenience caused. 

We have tried to achieve your reuirement as a workaround solution but we couldn’t achieve your below requirements completely through the workaround. 

1.The checkbox of grouping header disappear when we search an item. 

2. Make search by the grouping header and collapsing it by grouping header. 

We have logged your requirement as a feature request in our database. The feature implementation would also greatly depend on the factors such as product design, code compatibility and complexity. We will update you when this feature has been implemented. 

Please let us know if you have further concern. 

Regards, 

Kasithangam