I am pushing this issue off to later. I did give a try at showing a tooltip on a disabled menu item, but the combination of a menu, disabled item, and tooltip don't play together.
Normally, when using the disabled variant of many elements, this will disable all mouse events, including mouse events to child elements.
It is possible to do something like this however:
<div data-tooltip="This will show">
<a class="ui disabled button">Even though this is disabled</a>
</div>
However, the nested structure of .ui.menu and .ui.menu.item are important and this workaround causes more edge cases. I also tried putting the tooltip on the .ui.menu which did technically work, but was a bit weird.
I think the disabled state is probably fine. If we get any confusion on this, it might be worth enabling the menu item and putting a form error on a disabled form. I could see how this would just be a confusing extra click too though.
I am pushing this issue off to later. I did give a try at showing a tooltip on a disabled menu item, but the combination of a menu, disabled item, and tooltip don't play together.
Normally, when using the
disabledvariant of many elements, this will disable all mouse events, including mouse events to child elements.It is possible to do something like this however:
However, the nested structure of
.ui.menuand.ui.menu.itemare important and this workaround causes more edge cases. I also tried putting the tooltip on the.ui.menuwhich did technically work, but was a bit weird.I think the disabled state is probably fine. If we get any confusion on this, it might be worth enabling the menu item and putting a form error on a disabled form. I could see how this would just be a confusing extra click too though.