PDA

View Full Version : [OPEN] Tooltips not working when button is disabled. Intended?



Tsunami2069
7 Jul 2015, 7:49 AM
Hello.
On some of my controllers, i had a command adding tooltips to a few buttons using some code similar to the following:
view.lookupReference('button1').setTooltip('teste');
As stated, the tooltips were working correctly.
After updating my project to Extjs 6.0.0.480, these tooltips have stopped working (not showing) if the button is disabled. They still work (show) if the button is enabled.
Is this intended or a possible bug?

Gary Schlosberg
7 Jul 2015, 3:46 PM
I think it's a bug, since I believe the tooltip has displayed on disabled buttons since at least 4.1.x. I'll move this thread to the Bugs forum.

Gary Schlosberg
7 Jul 2015, 3:55 PM
Thanks for the report! I have opened a bug in our bug tracker.

Tsunami2069
8 Jul 2015, 12:53 AM
Ok... Thanks a lot.

raphael.franchet
3 Aug 2015, 1:25 AM
I made a fiddle https://fiddle.sencha.com/#fiddle/rha with 3 different ways of making tooltips. It never works on disabled buttons.It is quite anoying.It is not working in 6.0.0 (nor in nightly) but working in 5.1.1 and 4.2.3

luismichel
20 Oct 2015, 2:58 PM
I'm currently using version 5.1.2.748 and the tooltip won't show in a disabled button.

HerbiePorter
22 Dec 2015, 2:28 AM
+1 This is pretty annoying.

Any idea on when this will be resolved?

H

Gary Schlosberg
22 Dec 2015, 6:06 AM
No news yet, but the bug ticket has a high priority so I expect this will get fixed soon.

michi--
24 Feb 2016, 5:23 AM
Any news to this topic? Itīs a litte bit confusing without displaying a tooltip on a disabled button :/

WO_Jef
24 Feb 2016, 7:36 AM
To get the functionality back to how it was in previous versions, you can remove the following CSS property that was added:



/* packages/ext-theme-base/sass/src/Component.scss:189 */
.#{$prefix}item-disabled,
.#{$prefix}item-disabled * {
cursor: default;
pointer-events: none; // prevents :hover styling on child elements
}

That line prevents the hover styling, but it also prevents the tooltip from showing. If this is taken out, the tooltip now shows, but you'll sometimes see the pointer cursor show up... which is why I'm assuming this property was added in.

michi--
24 Feb 2016, 8:03 AM
Hi WO_Jef,

are you sure that your code is matching to Ext 6? I could not find any sass config for Component.sass :/

WO_Jef
24 Feb 2016, 8:05 AM
Yessir, you can see it in action here (https://fiddle.sencha.com/#fiddle/163r).

michi--
25 Feb 2016, 1:06 AM
Hey! thank you with the fiddle example. I implemented this in my application and works :)

VinhTrang
17 Jul 2016, 11:27 PM
Hi WO_Jef,

Thanks for your solution. I could have a concern that can we override the Component.scss with new class without pointer-events property instead remove it in Ext theme base? (E.g: I create a new class name Component.scss and in that I have only



.#{$prefix}item-disabled,
.#{$prefix}item-disabled * {
cursor: default;
}

ThorStan
3 Aug 2016, 3:53 AM
Hey, we have the same issue in ExtJS 5.1.3 and would be glad if someone could fix this.

Gary Schlosberg
4 Aug 2016, 1:22 PM
Thanks for the update. The EXTJS-18529 ticket covers 5.x as well.

tsippert
5 Sep 2017, 11:53 AM
Hello.
On some of my controllers, i had a command adding tooltips to a few buttons using some code similar to the following:
view.lookupReference('button1').setTooltip('teste');
As stated, the tooltips were working correctly.
After updating my project to Extjs 6.0.0.480, these tooltips have stopped working (not showing) if the button is disabled. They still work (show) if the button is enabled.
Is this intended or a possible bug?

You can do this programmaticly:



var button={
xtype : 'button',
tooltip: 'Tooltip',
text:'Text',
style: {
pointerEvents: 'all'
}
};


Or after the component is initialized:



button.setStyle({pointerEvents: 'all'});