Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-7688 in a recent build.
  1. #1
    Sencha User
    Join Date
    Sep 2012
    Posts
    83
    Vote Rating
    5
    mpost is on a distinguished road

      0  

    Default Unable to specify non-collapsible panels in accordion layout

    Unable to specify non-collapsible panels in accordion layout


    REQUIRED INFORMATIONExt version tested:
    • Ext 4.1.1
    • Ext 4.1.1 rev a
    Browser versions tested against:
    • Safari 6.0.1
    • Chrome 22.0.1229.94
    DOCTYPE tested against:
    • HTML5
    Description:
    • When using an accordion layout, all panels are forced to be collapsible: true. I want to arrange several panels so that a particular panel is always visible (cannot be collapsed).
    Steps to reproduce the problem:
    • Create a panel with accordion layout with multi: true.
    • Add several sub-panels.
    • Set all sub-panels to collapsed:true except for the last one which should be collapsible:false. (Collapsed vs. collapsible is intentional here.)
    The result that was expected:
    • Last panel is always expanded and cannot be collapsed.
    • All other panels are collapsed and can all be closed.
    The result that occurs instead:
    • First and last panel are both expanded.
    • Last panel can be collapsed.
    Test Case:
    PHP Code:
    Ext.create('Ext.Panel', {
        
    title'Example',
        
    width100,
        
    renderToExt.getBody(),
        
    layout: {
            
    type'accordion',
            
    align'stretch',
            
    multitrue
        
    },
        
    defaults: {
            
    height100
        
    },
        
    items: [
            {
            
    xtype'panel',
            
    title'panel 1',
            
    html'panel 1',
            
    collapsedtrue},
        {
            
    xtype'panel',
            
    title'panel 2',
            
    html'panel 2',
            
    collapsedtrue},
        {
            
    xtype'panel',
            
    title'panel 3',
            
    html'panel 3',
            
    collapsedtrue},
        {
            
    xtype'panel',
            
    title'panel 4',
            
    html'panel 4',
            
    collapsiblefalse},

            ]
    });
    ‚Äč 
    HELPFUL INFORMATION
    See this URL for live test case:
    http://jsfiddle.net/YpSN8/1/

    Debugging already done:
    • none
    Possible fix:
    • One workaround is to attach a listener to the last panel for the beforerender event:
      PHP Code:
      listeners: {beforerender: function(paneleOpts) {if (panel && panel.collapsibledelete panel.collapsible;}}} 
    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • OS X 10.8.2
    • Windows 7 Pro SP1
    Last edited by mpost; 3 Nov 2012 at 7:27 PM. Reason: correct sample code

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,095
    Vote Rating
    855
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    I think in your test case you need to have one of the items with collapsible : false correct? That's the bug you are reporting.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Sep 2012
    Posts
    83
    Vote Rating
    5
    mpost is on a distinguished road

      0  

    Default


    Oops, you're right. I copy/pasted the wrong code for this bug. I've edited the original post to add collapsible: false to the last panel and updated the jsfiddle link.

Thread Participants: 1

Tags for this Thread