IE6 - Combobox - only first item visible on first click

**devtig** · 19 Feb 2013 9:48 AM

Ext version tested:

Ext 4.1.3
Ext 4.1.1

Browser versions tested against:

IE6 (6.0.2800) on Win2000
IE6 (6.0.2900) on WinXP

DOCTYPE tested against:

<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Description:

The dropdown list only shows the first item after clicking the trigger the first time. The other items remain hidden. When you click again on the trigger, all items are visible. This problem occurs in IE6 only. The screen shots says it all (reproduce, what expected and what not.)

Test Case:

Code:

Ext.define('MyApp.view.TestForm', {
    extend: 'Ext.form.Panel',
    initComponent: function() {
        var me = this;


        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'combobox',
                    name: 'id_country',
                    fieldLabel: 'Land',
                    displayField: 'description',
                    store: 'Countries',
                    valueField: 'id_country'
                }
            ]
        });


        me.callParent(arguments);
    }
});

Screenshot:
IE6 - Combobox - only first item visible on first click.PNG

See this URL for live test case: http://

Debugging already done:

Test all other browsers (no problem). Tested 4.1.1 and several doctypes (same problem)

Possible fix:

not provided

Additional CSS used:

No idea, beacuse difficult to debug IE6 only. IE7+ has no problems.

Operating System:

WinXP Pro

**evant** · 19 Feb 2013 1:10 PM

Ah, another good old IE repaint bug. As it goes, we actually have this one fixed for the 4.2 release, the bound list forces a repaint on the list element in IE6 when it refreshes.

**devtig** · 19 Feb 2013 1:15 PM

Great news. Mind sharing a snippet of the fix, so that I can apply it in my client's project using 4.1.1?

**evant** · 19 Feb 2013 3:15 PM

Code:

refresh: function(){
    var me = this,
        toolbar = me.pagingToolbar,
        rendered = me.rendered;
        
    me.callParent();
    // The view removes the targetEl from the DOM before updating the template
    // Ensure the toolbar goes to the end
    if (rendered && toolbar && toolbar.rendered && !me.preserveScrollOnRefresh) {
        me.el.appendChild(toolbar.el);
    }  
        
    // IE6 strict can sometimes have repaint issues when showing
    // the list from a remote data source
    if (rendered && Ext.isIE6 && Ext.isStrict) {
        me.listEl.repaint();
    }
}

**devtig** · 19 Feb 2013 11:49 PM

Thanks evant, it works! (4.1.1).

This bit is now in my ext-overrides.js until 4.2. The blue code is the bugfixer.

Code:

Ext.view.BoundList.override({
    refresh: function(){
        var me = this,
            toolbar = me.pagingToolbar,
            rendered = me.rendered;

        me.callParent();
        // The view removes the targetEl from the DOM before updating the template
        // Ensure the toolbar goes to the end
        if (rendered && toolbar && toolbar.rendered && !me.preserveScrollOnRefresh) {
            me.el.appendChild(toolbar.el);
        }  

        // IE6 strict can sometimes have repaint issues when showing
        // the list from a remote data source
        if (rendered && Ext.isIE6 && Ext.isStrict) {
            me.listEl.repaint();
        }
    }
});

IE6 - Combobox - only first item visible on first click

Thread Tools

Search Thread

Display

IE6 - Combobox - only first item visible on first click

IE6 - Combobox - only first item visible on first click