View Full Version : [SOLVED] Error with getSize(), getHeight(), when component not rendered

18 Aug 2009, 5:56 AM

I don't know if it's a bug or something "normal", but while upgrading my application to Ext 3.0, I'm experiencing a problem :

When clicking on a grid row, it open's dinamically a window with a form panel. The window code is retrived by an ajax request, and executed by an eval().

When the code si executed in the eval() function, it calls one function I made, named resize().

In my resize function, I do things like : oneFieldset.setHeight(secondFieldset.getHeight() - 10);

But It seems my fieldset is not rendered yet and the getHeight() function return an error : this.getResizeEl() is undefined.

getHeight : function(){
return this.getResizeEl().getHeight();

Someone has a clue ?

Thank you.

18 Aug 2009, 6:54 AM
If I do something like :

if(myFieldset.rendered) {
else {
myFieldset.on('render', resize);

It works. But It was working without it in Ext 2.3.0, and change this function on each .js will be very long. Can't we have a verification before getHeight if getResizeEl() is undefined ?

18 Aug 2009, 11:04 PM
Just to compare, if I look at the Ext 2.3.0 doc, I can't click on getSize() function to view the source.

Someone know where I can find it ?

Thank you.

18 Aug 2009, 11:34 PM
Maybe I should do a function "itemsAllRendered" in my FormPanel before calling resize(), but I don't get what has changed since Ext 2.3 to 3.0 for the getSize() function.

In desktop mode I have lot of problems with items not rendered, I have to put listeners on my form load, and in my resize function. I don't get why.


18 Aug 2009, 11:35 PM
Why would you look at the 2.3.0 doc?

But to see source, why wouldn't you just look at source code in your SDK?

Anyway, I suspect you are trying something bizarre and invalid. What application problem are you trying to solve?

18 Aug 2009, 11:44 PM
I wanted to look at the 2.3.0 doc because it was working before upgrading to 3.0.

So I have the source of the function in the 3.0 and just wanted to compare it with the 2.3 one.

I'm trying to solve this problem :

I have an application, you can choose Portal or Desktop mode (juste like the examples). Everyting is fine in portal mode.

But when I log into Desktop and open windows instead of tab panels, I have javascript errors.

All these errors came from the same problem : I want to get the size of a component that is not rendered yet.

I don't know why in 2.3 the components were all rendered before the function acces it, and why it's working in portal when adding my form to a tab panel and not to a window.

I'm lost.

Thanks for any help !

19 Aug 2009, 12:33 AM

Ext.Container.prototype.bufferResize = false;

At the very top, before your onReady call.

19 Aug 2009, 12:44 AM
Just tried it at the very top, and then elsewhere, but nothing changed.

It's weird that the setHeight function doesn't throw any error when components are not rendered, but the getHeight does.

Anyway, thank you for the tip!

19 Aug 2009, 12:50 AM
If it's not rendered, then what element should it return the height of?

19 Aug 2009, 12:55 AM
The element should be rendered, I don't try to get the height of something non-existent intentionally.

But what I would have expected, is the getHeight function returns 0 or undefined, or whatever but not an error that make my script do some strange reaction :)

Maybe I can deffer the resize function.

19 Aug 2009, 1:06 AM
What are you trying to do?

You should not have to size anything.

Ext does that for you if you provide appropriate configuration.

19 Aug 2009, 1:24 AM
I've attached a thumbnail so you can imagine better.

I have 2 fieldsets, and a grid in a tab panel.
When I collapse a fieldset, I want the grid to fill the empty space.

So I've put 2 event listeners on my fieldsets to call my resize function when someone toggle it.

And as I don't know the height of my fieldset before they are rendered with their fields (the number can change), I have to call my resize method when I load the page, so every component has the good size.

I just don't know how to do all this stuff with only layout options.

The thumbnail is what I've called the "portal" in my precedent posts, so everything works here. The probleme is when my panel is not added to a tab panel, but in a window.

If you think I could do everything with layout, I'll try to go this way, because it will be easier to maintain.
I just didn't wanted to lose time to do something that I couldn't :)

Thank you.

19 Aug 2009, 2:03 AM
Looks like a vbox layout to me.

layout: {
type: 'vbox',
align: 'stretch'
items: [ fieldset1, fieldset2, gridPanel ]

Configure the gridPanel with flex: 1

Add collapse/expand listeners to the two FieldSets.

Call doLayout on that Container whenever either FieldSet expands or collapses.

19 Aug 2009, 3:39 AM
Seems to work, you saved my day !

Thank you :)