search

CuppaLabs / angular2-multiselect-dropdown

Angular 2 Dropdown Multiselect
https://cuppalabs.github.io/angular2-multiselect-dropdown
MIT License
280 stars 257 forks source link

Group Header has to checked if any one of the Child checkbox is checked and How to Customize C-badge #629

Open LaRis742 opened 1 year ago

LaRis742 commented 1 year ago

Hi CuppaLabs,

I am really happy when I found "angular2-multiselect-dropdown" packages and it helped a lot for my development. Could you please help me to enhance the below new features based on my requirement. Much appreciated in advance for your help on this.

  1. Please find below screen that we have selected Petrol under Car Group, so the requirement is that "Car has to select if we select any one of the Child check box selected" that means, Group header check box has to checked if any one of the child checkbox has selected. image

  2. Please find below screen that we have "Petrol, Diesel & Electricity" items and we have selected Petrol under "Bus & Car" but we need to display only one Badge for Petrol even though we selected two Petrol items in different Group. Could you please help to do this enhancement

image

Please let me know if you need any more details.

Thanks. LaRis.

LaRis742 commented 1 year ago

@CuppaLabs , Could you please someone from your team help me on the above requirements.

Thanks, LaRis.

LaRis742 commented 1 year ago

@CuppaLabs, Could you please someone from your team help me on the above requirements.

Thanks, LaRis.

CuppaLabs commented 1 year ago

@LaRis742 Will be fixed shortly.

LaRis742 commented 1 year ago

@CuppaLabs , Thanks for working on this. Could you please let me know once it is fixed so that I will verify and will confirm to you.

LaRis742 commented 1 year ago

@CuppaLabs , Could you please save my life and I am waiting for this changes since 10 days.

Please find below Dataset for your reference to do Unit test on your change once you have done the changes.

Component:

this.settings = { singleSelection: false, text: "Select Fields", selectAllText: 'Select All', unSelectAllText: 'UnSelect All', enableCheckAll: true, searchPlaceholderText: 'Search Fields', enableSearchFilter: true, badgeShowLimit: 5, groupBy: "category", };

this.itemList = [
  { "id": 1, "itemName": "Diesel", "category": "Bus" },
  { "id": 2, "itemName": "Petrol", "category": "Bus" },
  { "id": 3, "itemName": "Diesel", "category": "Car" },
  { "id": 4, "itemName": "Petrol", "category": "Car" },
  { "id": 5, "itemName": "Electricity", "category": "Car" },
  { "id": 6, "itemName": "Petrol", "category": "Bick" }
];

this.selectedItems = [
  { "id": 1, "itemName": "Desiel" },
  { "id": 2, "itemName": "Petrol" },
  { "id": 4, "itemName": "Petrol" }

];

Template

    <angular2-multiselect [data]="itemList" [(ngModel)]="selectedItems" [settings]="settings">
    </angular2-multiselect>
LaRis742 commented 1 year ago

@CuppaLabs , Could you please help on this to get it fixed.

Tweniee commented 7 months ago

I believe the two points you raised have some merit, but I find both of them to be invalid.

  1. The header checkbox shouldn't be checkable [X] if only one child is selected. It should only be checked when all of the children are selected.

  2. If there are two different groups with the same child, data binding should handle this situation. The child should not be selected twice but displayed only once.