components missing after replacing panel contents

[nutflakes]

Hi,

I'm trying to implement a dynamic layout.
So I defined a borderlayout with a basic toolbar in the north panel.
On click to a navigation item the content of the center panel is replaced.
But first all existing components are removed.

My problem is now that I want to load the components via function.

Here is my source

[CODE]
Ext.namespace('myNamespace');

myNamespace.layout = function() {
var titleSelect;

var loadTitleSelect = function() {
if(!titleSelect) {
// erzeugen
titleSelect = new Ext.form.ComboBox({
store: new Ext.data.SimpleStore({
fields: ['id', 'salutation'],
forceSelection: true,
data : [
[1, 'Dr.'],
[2, 'Professor']
]
}),
fieldLabel: 'Titel',
displayField:'salutation',
typeAhead: false,
mode: 'local',
editable: false,
triggerAction: 'all',
emptyText:'bitte w

[devnull]

I am guessing that the var titleSelect is not working as you think it will.
When the form is replaced, the combo is destroyed, but the var will still be defined (but empty).
Why not just put the combobox in with the rest of the form constructor config?

[nutflakes]

thanks for your reply!

I know the way you suggest is working but the code will become very unclear and this is what I wanted to provide.
Hmm as this will be a prototype only I will put the components in.

nutflakes

[devnull]

Actually I think the code is much harder to read when the layout is broken up into multiple sections. In my apps I try to construct the layout using as few objects as possible.