Messy Layouts

[dimitrij.zub]

Hi everyone.

I have kind of a complex layout which is randomly rendered as a mess. So the fields move, are too big and so on. And as well randomly the field looks just perfect!

Does anybody have any idea what the problem might be?

[Animal]

Sorry, my crystal ball is at home right now.

In the absence of that, and in the same vein as your posting, I'd say the answer is: You've done something wrong.

[dimitrij.zub]

OK so no obvious reason

Lets see:

I am adding a custom panel to a tab pane.

Upon this adding it gets layouted kinda messy.

I am attaching the files below which are doing the jobs.

See the messy1, messy2 and fine.jpgs

I have the feeling that i am doing something wrong in the design of how the components should work, as I am not a JavaScript extpert.

Some help on making the beheviour of ExtJS deterministic would be highly appriciated.

[Animal]

It looks OK at first glance.

One thing I noticed:

_tab_panel.insert(0, _panel).show();

You don't get to show the items in a multi-child Container. You ask the Container to show the one you want. Use setActiveItem. And configure your TabPanel with layoutOnTabChange:true

[dimitrij.zub]

Done that. Still the problem persists.

The funny thing is, that it DOES render the tab sometimes just perfect. But if I close it and open it again, is MIGHT be messed up.

As well I have a lot of strange behavior going on in my project like some elements are not shown if i remove some lines of text and so on.

But back to the basic problem and maybe some best practice. ...

I am building the portal in panel objects all should behave independent what shall I do to have the most independend structure with JS/ExtJS?

I have the feeling that it just sucks at a lot of spaces and depends on a lot of factors how the whole thing is behaving and its slipping out of controll some how

I did the blog 'Writing big application with Ext' and followed the guidlines but still i feel like im running into some mess the bigger the project will get

[Animal]

"Close it and open it."?

Does it get destroyed, and recreated?

It would be easier to see what was going on if you could post a link to a live page.

[dimitrij.zub]

I cant provide a live page now as I have no access to the router here

Close it means:

I close it on the panel (Click on the x)

Open it means: It gets recreated. (See Actions...)

Funny thing i just discovered:

If i add another panel with fields and then add the EditAccountPanel the chance to have a messed up layout is much higher. (See Actions -> password_panel)

[Animal]

You are hardcoding an ID into a class definition. Classes are reusable, but IDs must be unique:

Ext.rt.EditAccountPanel = Ext.extend(Ext.form.FormPanel, {	
	id: 'Ext.rt.EditAccountPanel', <-- bad

[dimitrij.zub]

I did this i.o. to find the class later in the management (s. Actions) -> tab.activate.

You have an idea of how to manage this otherwise?

[dimitrij.zub]

Tried removing ids from everywhere. Still random layout problems.