You found a bug! We've classified it as EXTJS-10678 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Ext JS Premium Member
    Join Date
    Jul 2010
    Location
    UK
    Posts
    524
    Vote Rating
    29
    MrSparks has a spectacular aura about MrSparks has a spectacular aura about

      0  

    Default Accordion Panel :Object [object Object] has no method 'onComponentExpand'

    Accordion Panel :Object [object Object] has no method 'onComponentExpand'


    For several weeks the nightly builds have contained a serious error in the accordion component. Essentially once an accordion panel is hidden, you are unable to show it again.... and an error is thrown: Object [object Object] has no method 'onComponentExpand'

    I wanted to make the Dev/Test Team aware of this, just in case its going unnoticed.

    Currently nightly build "ext-4.2.2-20130713"

    The following code
    Code:
    <html>
    <head>
    <title>Accordion Layout Hide/Show Panel Issue</title>
    <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
    <style type="text/css">
        p {
            margin:5px;
        }
        .settings {
            background-image:url(ext/shared/icons/fam/folder_wrench.png);
        }
        .nav {
            background-image:url(ext/shared/icons/fam/folder_go.png);
        }
        .info {
            background-image:url(ext/shared/icons/fam/information.png);
        }
    </style>
    
    
    <script type="text/javascript" src="/ext/ext-all-debug-w-comments.js"></script>
    <script type="text/javascript">
    
    
    Ext.require(['*']);
    
    
    Ext.onReady(function(){
        //console.clear()
        var items = [],
            i = 1;
            
        for (; i < 11; ++i) {
            items.push({
                id: 'panel' + i,
                html: 'panel' + i,
                title: 'panel' + i
            });
        }
        
        new Ext.Viewport({
            layout: 'border',
            items: [{
                region: 'west',
                width: 210,
                layout: 'accordion',
                id: 'myaccord',
                listeners: {
                    afterlayout: function() {
                        console.log('Layout Fired')
                    }
                },
                items: items
            }, {
                region: 'center',
                defaultType: 'button',
                items: [{
                    text: 'show 1 - 5',
                    margin: '10 10 10 10',
                    toggleGroup: 'blah',
                    handler: function(){
                    
                    
                    for (var i = 1; i < 6; ++i) {
                        Ext.getCmp('panel' + i).show();
                        Ext.getCmp('panel1').expand();
                       }
                    for (var i = 6; i < 11; ++i) {
                        Ext.getCmp('panel' + i).hide();
                    }
                     
                     
                    }
                }
                ,
                {
                    text: 'Show 6 - 10',
                    toggleGroup: 'blah',
                    handler: function(){
    
    
                   
                    for (var i = 1; i < 6; ++i) {
                        Ext.getCmp('panel' + i).hide();
                        }
                    for (var i = 6; i < 11; ++i) {
                        Ext.getCmp('panel' + i).show();
                        Ext.getCmp('panel6').expand();
                    }
                   
                      }
                },
                {
                    text: 'Show 1 - 10',
                    toggleGroup: 'blah',
                    margin: '10 10 10 10',
                    handler: function(){
                    
                    for (var i = 1; i < 11; ++i) {
                        Ext.getCmp('panel' + i).show();
                        Ext.getCmp('panel1').expand();
                    }
                   
                      }
                },
                {
                    text: 'Enable Suspend Tweak',
                    id: 'suspendbutton',
                    margin: '10 10 10 10',
                    enableToggle: true
                }]
            }]
        });
    });
    
    
    </script>
    </head>
    <body>
        
    </body>
    </html>

    *EDIT BY SLEMMON
    Tests OK in 4.2.1. Issue observed in next release (SDK).
    Steps for inline test below: Click "Hide First" > Click "Show / expand First"
    Code:
    
    
    Code:
    var parent = Ext.widget('panel', {
        renderTo: document.body,
        height: 500,
        width: 200,
        tbar: [{
            text: 'Hide First',
            handler: function () {
                parent.down('[title=First]').hide();
            }
        }, {
            text: 'Show / Expand First',
            handler: function () {
                parent.down('[title=First]').show().expand();
            }
        }],
        layout: 'accordion',
        items: [{
            title: 'First',
        }, {
            title: 'Second'
        }]
    });

    Last edited by slemmon; 16 Jul 2013 at 8:54 AM. Reason: additional test notes

  2. #2
    Ext JS Premium Member
    Join Date
    Jul 2010
    Location
    UK
    Posts
    524
    Vote Rating
    29
    MrSparks has a spectacular aura about MrSparks has a spectacular aura about

      0  

    Default


    Mods: please move this to EXTJS bugs

  3. #3
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    5,010
    Vote Rating
    183
    slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold

      0  

    Default


    Thanks for the report! I have opened a bug in our bug tracker.

Thread Participants: 1