Threaded View
-
28 Nov 2012 11:26 AM #1
Disabled EXT field tooltips not showing in FireFox
Disabled EXT field tooltips not showing in FireFox
Environment:
Firefox 17
Windows 7
IE 9
ExtJS 4.1.1
Hey everyone,
Let me start off by saying that I realize that this is a duplicate bug. I've seen similar bug reports throughout the forums, but none with a satisfying answer. The posts I've read through are all listed as can not reproduce or as fixed by Mozilla Bug 274626. Unfortunately, I'm certain that this bug has not been fixed as I am currently having problems with it.
The problem is that tooltips are not displayed for disabled fields in firefox. Many users before me have pointed out that Mozilla Bug 274626 addresses this issue and has been fixed. As far as I can tell, these bugs are related, but not the same.
Tooltips for simple HTML inputs are fixed by Mozilla Bug. For example, the following tooltip for a simple HTML input button works correctly when the button is disabled:
Although this bug fixes the problem with tooltips for disabled fields, it does not directly address the problem with extjs controls. In the following code, tooltips are displayed for all buttons when the webpage is loaded in chrome or IE9, but only the tooltip for the enabled buttons display when loaded in Firefox17Code:<button type="button" title = "test" disabled = "disabled" >Click Me!</button>
The fix details of Mozilla Bug 274626 specifically mention that the title attribute of of the control is now correctly displayed when the control is disabled. However, the extjs controls do not have a title attribute.Code:Ext.onReady(function(){ Ext.tip.QuickTipManager.init(); var form = Ext.create('Ext.form.Panel', { renderTo: Ext.getBody(), title: 'Simple Form', bodyPadding: 5, width: 350, layout: 'anchor', defaults: { anchor: '100%' }, // The fields defaultType: 'textfield', items: [{ fieldLabel: 'First Name', name: 'first', allowBlank: false },{ fieldLabel: 'Last Name', name: 'last', allowBlank: false }], // Reset and Submit buttons buttons: [{ text: 'Reset', tooltip : 'my Button Tooltip Text', id : 'my-button ', handler: function() { this.up('form').getForm().reset(); } }, { text: 'Submit', tooltip:'Submit', formBind: true, //disabled: true, handler: function() { Ext.getCmp('my-button ').disable(); } }], renderTo: Ext.getBody() }); });
This jsfiddle(http://jsfiddle.net/BSjqJ/12/) shows the bug in action. When loading the jsfiddle in chrome or IE9, the tooltips for all buttons should be displayed, regardless of the button being enabled or disabled. However, when loaded in Firefox17, the tooltip for the simple HTML clickme control is displayed, but the tooltip for the disabled ext button is not displayed.
I would greatly appreciate me if someone could let me know if there is a workaround for this or if I'm doing something wrong! Thank you for your help,
Adam
You found a bug! We've classified it as
EXTJSIV-7849
.
We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.


Reply With Quote