PDA

View Full Version : layoutDialog form in East



hosehead
17 Aug 2007, 11:05 AM
I have a dialog. I used the photo chooser example as a base to start with.
I changed that dialog to have "center" and "south" panels. Now I am adding the east panel back and putting a form into it.

Problem is I can not for the life of me figure out how to access the east panel in order to put a div into it, so that I can use that div object to render the form.

I'm quite certain that I am going about this incorrectly but here is the code I am using to instantiate the objects.




var dlg = new Ext.LayoutDialog(config.id || Ext.id(), {
autoCreate : true,
minWidth:500,
minHeight:500,
syncHeightBeforeShow: true,
shadow:true,
fixedcenter:true,
closable: false,
center:{autoScroll:false},
east:{autoScroll:false,split:true,initialSize: 300},
south:{autoScroll:false,split:true,initialSize: 150}

});
dlg.setTitle('Completion Photo Details');
dlg.getEl().addClass('ychooser-dlg');
dlg.addKeyListener(27, dlg.hide, dlg);

// add some buttons
this.ok = dlg.addButton('OK', this.doCallback, this);

//dlg.setDefaultButton(dlg.addButton('Cancel', dlg.hide, dlg));
dlg.on('show', this.load, this);

this.dlg = dlg;
var layout = dlg.getLayout();

//divs
//var viewEl2 = layout.getEl().createChild({tag:'div', id:'form-ct3'});
var albums1 = layout.getEl().createChild({tag:'div', id:'albums1'});
var viewEl1 = albums1.createChild({tag:'div', id:'folders1'});
var viewEl2 = albums1.createChild({tag:'div', id:'form-ct3'});

//form
var fs = new Ext.form.Form({
labelAlign: 'right',
labelWidth: 80
});

fs.fieldset(
{legend:'Contact Information'},
new Ext.form.TextField({
fieldLabel: 'First Name',
name: 'first',
width:190
}),

new Ext.form.TextField({
fieldLabel: 'Last Name',
name: 'last',
width:190
}),

new Ext.form.TextField({
fieldLabel: 'Company',
name: 'company',
width:190
}),

new Ext.form.TextField({
fieldLabel: 'Email',
name: 'email',
vtype:'email',
width:190
}),

new Ext.form.ComboBox({
fieldLabel: 'State',
hiddenName:'state',
store: new Ext.data.SimpleStore({
fields: ['abbr', 'state'],
data : Ext.exampledata.states // from states.js
}),
displayField:'state',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'Select a state...',
selectOnFocus:true,
width:190
}),

new Ext.form.DateField({
fieldLabel: 'Date of Birth',
name: 'dob',
width:190,
allowBlank:false
})
);


//fs.addButton('Save');
//fs.addButton('Cancel');

fs.render('form-ct3');



any advice is appreciated.

hosehead
17 Aug 2007, 11:30 AM
Geeez..
Never Mind...
I found my problem.
Don't give an idot like me a text editor.




var form1 = layout.add('east', new Ext.ContentPanel(albums1, {
title:'Forms',
fitToFrame:true,
autoScroll:true,
autoCreate:true,
resizeEl:viewEl2
}));