Results 1 to 3 of 3

Thread: Quicktips broken in ExtJS 4.1.3

    Wait! Looks like we don't have enough information to add this to bug database. Please follow this template bug format.
  1. #1
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    12
    Vote Rating
    0
      0  

    Default Quicktips broken in ExtJS 4.1.3

    ExtJS 4.1.3
    Chrome Browser

    All my QuickTips in my dialogs stopped working going between ExtJS 4.1.1a to ExtJS 4.1.3. I tracked it down to a new method that showed up in ExtJS 4.1.3: Ext.tip.QuickTip now implements Show:

    Code:
        show: function(){
            var me = this,
                fromDelay = me.fromDelayShow;
                
            // We're coming from a delayed show, so check whether
            // the attribute has been removed before we show it 
            if (fromDelay && me.targetTextEmpty()) {
                me.onShowVeto();
                delete me.activeTarget;
                return;
            }
            me.callParent(arguments);    
        },
    In my case the first time show is called, fromDelay and me.targetTextEmpty() return true so we never end up calling the parent to show the tip. removing the return after delete.activeTarget fixes the problem.

    Here's how I create the QuickTip: I added an attribute to a a field called helpText. After my field is rendered I call a method inhjectHelpTextIcon to add the quick tip:

    Code:
                    Ext.override(Ext.form.Field, {
                        afterRender: function() {
                            this.callOverridden(arguments);
                            Console.Utilities.injectHelpTextIcon.call(this);
                        }
                    });
    Code:
        injectHelpTextIcon: function() {
            var label, helpImage;
    
    
            if (this.helpText) {
                label = this.getEl().down('.x-form-item-label');
                if (label) {
                    helpImage = label.createChild({
                        tag: 'span',
                        cls: 'info-tooltip',
                        style: 'margin-bottom: -2px; margin-left: 4px; padding: 0px;'
                    });
                    Ext.tip.QuickTipManager.register({
                        target: helpImage,
                        text: this.helpText,
                        baseCls: 'custom-x-tip',
                        dismissDelay: 60 * 60 * 1000 // 0 is suppose to be forever but it doesn't work in 4.1
                    });
                }
            }
        },

    Also, setting dimissDelay to 0 doesn't cause the tip to never go away.

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,780
    Vote Rating
    1312
      0  

    Default

    Can I get a locally runnable test case?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  3. #3
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    12
    Vote Rating
    0
      0  

    Default

    Create a blank application with Sencha Cmd. Then replace App/app/view/Viewport.js with this:

    Code:
    Ext.override(Ext.form.field.Base, {
        afterRender: function() {
            var label, helpImage;
    
    
            this.callOverridden(arguments);
            if (this.helpText) {
                label = this.getEl().down('.x-form-item-label');
                if (label) {
                    Ext.tip.QuickTipManager.register({
                        target: label,
                        baseCls: 'custom-x-tip',
                        dismissDelay: 60 * 60 * 1000 // 0 is suppose to be forever but it doesn't work in 4.1
                    });
                }
            }
        }
    });
    
    
    // Ext.override(Ext.tip.QuickTip, {
    //     show: function(){
    //         var me = this,
    //             fromDelay = me.fromDelayShow;
    // 
    //         // We're coming from a delayed show, so check whether
    //         // the attribute has been removed before we show it 
    //         if (fromDelay && me.targetTextEmpty()) {
    //             me.onShowVeto();
    //             delete me.activeTarget;
    //             // ExtJS 4.1.3 returns here and doesn't call the parent to show the tip
    //             // http://www.sencha.com/forum/showthread.php?255445-Quicktips-broken-in-ExtJS-4.1.3&p=934994#post934994
    //         }
    //         me.callParent(arguments);    
    //     }
    // });
    
    
    Ext.define('Console.view.Viewport', {
        renderTo: Ext.getBody(),
        extend: 'Ext.container.Viewport',
        requires:[
            'Ext.tab.Panel',
            'Ext.layout.container.Border'
        ],
    
    
        layout: {
            type: 'border'
        },
    
    
        items: [{
            region: 'west',
            xtype: 'panel',
            title: 'west',
            width: 150,
            items: {
                xtype: 'textfield',
                fieldLabel: 'Name',
                helpText: true
            }
        },{
            region: 'center',
            xtype: 'tabpanel',
            items:[{
                title: 'Center Tab 1'
            }]
        }]
    }, function () {
    });
    Run the example and hover over the "Name" textfield and the tip won't show. Comment in the fix and it will show

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •