affecting disabled options when select or deselect All in ng-multiselect-dropdown

Question

I am using the npm package ng-multiselect-dropdown for multiple select in my angular project and its working fine except one case like below:

we have one selected field and it's also disabled. but when I clicked on select All then it's deselected first and select other fields and after that I am not able to select this disabled option again. So my question is now how can we stop this I mean disabled value should not be deselected on choose Select All/Deseclect All.

you can check in below link also

https://stackblitz.com/edit/ng-multiselect-dropdown-selected-disabled-values-problem?file=src/app/app.component.html

Answer 1

First of all: It is not the best user experience to select disabled items. But if you wanna do it you can it do with a little trick:

Use the onSelectAll method on your dropdown. (onSelectAll)="onSelectAll($event)"

And then set it again on onSelectAll. the "...this.selectedItems1" clone the object and then we add the two disabled items. Code

onSelectAll(data: any) {
    setTimeout(() => {
      this.selectedItems1 = [...this.selectedItems1,
        {id: 1, text: 'AAAAAAA', isDisabled: true}, 
        {id: 2, text: 'BBBBBBB', isDisabled: true}
      ];
    })
  }

But a onDeselectAll function does not exists. So on unselectAll all items are deselected.

In the end: This is not a bug, this is the expect behavior, look here:

User: If there are disabled checkboxes in the dropdown and when select all is selected, it is selecting the disabled checkboxes as well.

Author: Got it. will be fix in next release.