How to disable an option in the MultiSelectComponent

[sprijk]

I'm using the MutliSelectComponent with the CheckBoxSelection service injected. Really nice!

Now, I would love to render the list of options being able to show an option as "disabled" (so non-selectable) relating to the data in dataSource.

How to do that?

Thanks a lot!

[BerlyChristopher94]

Hi Sprijk,

Greetings from Syncfusion support.

Currently, we have not provided support for disabling specific items in EJ2 MultiSelect control. We are considering this as a feature request. You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through the below feedback link.

https://www.syncfusion.com/feedback/4785/

Until then you can disable the particular item with help of adding an e-disabled class manually in the component’s open event. Kindly refer to the below code example.

      onOpen(args) {
        var LiElement = args.popup.element.querySelectorAll('.e-list-item');
        for (var i = 0; i < LiElement.length; i++) {
          if (LiElement[i].getAttribute('data-value') == 'DE') {
            LiElement[i].classList.add('e-disabled');
          }
        }
      }

Sample: https://stackblitz.com/edit/react-sszjzr?file=index.js

Regards, Berly B.C