Panel collapsed at afterrender is not expandable anymore

**Aurélien Warnon** · 14 May 2012 11:40 PM

Hi,

I'm trying to collapse the north panel at afterrender under some conditions, but when these conditions are met and the panel is collapsed (programmatically), it's just not expendable anymore.

Here is a simple test case:

Code:

<html>
<head>
<title>Test case</title>
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<script type="text/javascript" src="ext-all.js"></script>
<script type="text/javascript">
    Ext.onReady(function() {
        this.collapsiblePanel = Ext.create('Ext.panel.Panel', {
            header: false,
            region: 'north',
            html: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum',
            collapsible: true,
            split: true,
            collapseMode: 'mini'
        });
        
        this.collapsiblePanel.on('afterrender', function(){
            this.collapsiblePanel.collapse();
        }, this);
        
        Ext.create('Ext.Viewport', {
            renderTo: Ext.getBody(),
            layout: 'fit',
            items: [{
                xtype: 'panel',
                layout: 'border',
                items: [{
                    title: 'Center panel',
                    region: 'center',
                    html: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum'
                }, this.collapsiblePanel]
            }]
        });
});
</script>
</head>
<body>
    
</body>
</html>

My app code is of course much more complicated, but I'd like to say it worked in 4.0.7 and I'm having troubles upgrading to 4.1. Please tell me what I'm doing wrong.

**scottmartin** · 15 May 2012 12:18 PM

See if this works for you:

Code:

Ext.onReady(function() {
    this.collapsiblePanel = Ext.create('Ext.panel.Panel', {
        header: false,
        region: 'north',
        html: 'NORTH',
        collapsed: true,
        collapsible: true,
        split: true,
        collapseMode: 'mini'
    });
   
    Ext.create('Ext.Viewport', {
        //renderTo: Ext.getBody(), // viewport does this automatically
        layout: 'fit',
        items: [{
            xtype: 'panel',
            layout: 'border',
            items: [{
                title: 'Center panel',
                region: 'center',
                html: 'CENTER'
            }, this.collapsiblePanel]
        }]
    });
});

Regards,
Scott.

**scottmartin** · 15 May 2012 12:32 PM

I see it was working in 4.07, but not in 4.1. I also added as a listener and same result. I believe there were some issues with afterRender in some cases, but I have to research this some more.

Just wanted to comment as you mentioned you want to collapse in code rather than a property.

Scott.

**Aurélien Warnon** · 21 May 2012 3:45 AM

It indeed works with the property but as I mentioned it's impossible for me to do it this way.

Should I expect another answer ? Your last post is making me doubt.

**Aurélien Warnon** · 31 May 2012 1:30 AM

Any news on this ? Our application can't be released in 4.1.1 until it's fixed.

**scottmartin** · 31 May 2012 12:28 PM

This is a pending issue and is still open at this time: EXTJSIV-5149
I will see what can be done to escalate this.

Scott.

**Gordonh** · 5 Jun 2012 9:20 AM

Hi There-

I don't know if this helps, but I have the similar problem with a tree panel in 4.1.0. I've worked around this by using the expand method, but delaying the call so that the rendering has a chance to complete.

Regards,
Gordon

Panel collapsed at afterrender is not expandable anymore

Thread Tools

Search Thread

Display

Panel collapsed at afterrender is not expandable anymore

Panel collapsed at afterrender is not expandable anymore