Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Mar 2011
    Posts
    32
    Vote Rating
    2
    wzl002 is on a distinguished road

      0  

    Default [4.1] ( IE 7 only ) Panel/Componet Can't getHeight() in beforeLayout.

    [4.1] ( IE 7 only ) Panel/Componet Can't getHeight() in beforeLayout.


    REQUIRED INFORMATION




    Ext version tested:
    • Ext-4.1.0-gpl


    Browser versions tested against:
    • ____
    • IE8
    • FF11.0
    • IE7


    Description:
    • Panel Can't get correct value by getHeight() in beforeLayout..


    Steps to reproduce the problem:
    • Create a Panel with height, overwrite the beforeLayout method and run 'getHeight()'.


    The result that was expected:
    • getHeight() return the height as set.


    The result that occurs instead:
    • In IE 7, getHeight() return a wrong value.


    Test Case:


    Code:
        Ext.create('Ext.panel.Panel', {
    
    height: 500,
    ...
    
    beforeLayout: function(){
    
    var height = this.getHeight(); // IE8, FF, get 500, IE7 get 15
    
    return this.callParent(arguments);
    }
    }





    HELPFUL INFORMATION






    Debugging already done:
    • none


    Possible fix:
    • not provided


    Additional CSS used:
    • only default ext-all.css


    Operating System:
    • WinXP

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,522
    Vote Rating
    814
    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


    Thanks for the report.
    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 - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,294
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    It seems like this logic should not be in beforeLayout but in afterLayout. It is the job of the layout to determine the height.

    In your example, you have a hard-coded height, so your use of getHeight should work in this limited case. If you only need it to work in this scenario, you can obviously access the height property as a workaround for now. If you need getHeight to be correct in more general cases, the logic cannot be inside of beforeLayout (if you want the correct answer).
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  4. #4
    Sencha User
    Join Date
    Mar 2011
    Posts
    32
    Vote Rating
    2
    wzl002 is on a distinguished road

      0  

    Default


    Quote Originally Posted by dongryphon View Post
    It seems like this logic should not be in beforeLayout but in afterLayout. It is the job of the layout to determine the height.

    In your example, you have a hard-coded height, so your use of getHeight should work in this limited case. If you only need it to work in this scenario, you can obviously access the height property as a workaround for now. If you need getHeight to be correct in more general cases, the logic cannot be inside of beforeLayout (if you want the correct answer).
    It was a logic in my custom component. I wrote a portalpanel with layout 'column', and I want all its items has the same height as the portal, so I set the items's height in the portal's beforLayout.
    Now with a hard-coded height(it wasn't), I have change the me.getHeight() into me.height to fix it.
    But a same code get different result in browsers, I think this is a need report bug, isn't it?

  5. #5
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,294
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    As I mentioned, the height of a component is not known in beforeLayout in most cases. Calling getHeight at this time will just return whatever the raw markup or the last layout produced. This won't be correct if you define "correct" as what the height should be based on its layout - that is, the size it will be in afterLayout.

    If you need to watch for size changes, you can override afterLayout, but it is probably better use a resize event listener since that will avoid work when layouts result in no size change.

    All that said, however, the goal you describe of a column layout where all columns have the same height is probably better achieved by an hbox layout using align stretch:

    PHP Code:
        {
            
    xtype'container',
            
    layout: {
                
    type'hbox',
                
    align'stretch'
            
    },
            
    items: [{
                
    title'Column 1'
            
    },{
                
    title'Column 2'
            
    },{
                
    title'Column 3'
            
    }]
        } 
    That will be much more efficient than trying to match the size of the columns in a column layout by watching the size of the container.
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  6. #6
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,294
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    I'm going to close this ticket because any value you might get from getHeight in beforeLayout will by definition be incorrect. The height will determined by the layout of the container, so the logic dependent on that value has to be located in a method or event that occurs after the value is calculated.
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

Thread Participants: 2