How to apply tooltip on disabled multiSelectDropdown itens

[Sidney Carlini Junior | Martinelli Labs]

Sup guys,

How can i achieve this result:

https://support.syncfusion.com/kb/article/14942/enable-tooltips-for-disabled-items-in-javascript-dropdownlist-components in ReactJS MultiSelectComponent? I tried the same classes or even the ones that multiSelect has, but could only apply on the active itens, the disabled ones do not receive the tooltip. I'm using dataManager + fields as the example in the docs:

const tagData = [

{ "text": "Add to KB", "State": false, id: 1 },

{ "text": "Crisis", "State": false, id: 2 },

{ "text": "Enhancement", "State": true, id: 3 },

{ "text": "Presale", "State": false, id: 4 },

{ "text": "Needs Approval", "State": false, id: 5 },

{ "text": "Approved", "State": true, id: 6 },

{ "text": "Internal Issue", "State": true, id: 7 },

{ "text": "Breaking Issue", "State": false, id: 8 },

{ "text": "New Feature", "State": true, id: 9 },

{ "text": "New Component", "State": false, id: 10 },

{ "text": "Mobile Issue", "State": false, id: 11 }

];

And the prop on my actual MultiSelect:

fields={{ text: 'text', disabled: 'State' }}

[Kokila Poovendran]

Hi Sidney Carlini Junior | Martinelli Labs,

Thank you for reaching out to us with your query on applying tooltips to disabled items in the ReactJS MultiSelect component.

We have prepared a sample that meets your requirements. You can find the sample here: React MultiSelect Tooltip Sample.

In this sample, we demonstrate how to display tooltips for disabled items in the MultiSelect component. Please review it and let us know if you have any further questions or need additional assistance.