PDA

View Full Version : Form contents not getting displayed in Panel



bunty
21 Sep 2012, 7:23 AM
Hi all,

I did this code:


Ext.widget('panel', { renderTo: 'pan1',
title: 'Basic Panel',
collapsible:true,
width:980,
height:155,
items: form
});

var form = Ext.widget('form', {
fieldDefaults: {
labelAlign: 'top',
msgTarget: 'side'
},
defaults: {
bodyPadding: 10,
border: false,
xtype: 'panel',
layout: 'anchor'
},
layout: 'hbox',
items: [{
items: [{
xtype:'textfield',
fieldLabel: 'First Name',
},{
xtype:'textfield',
fieldLabel: 'Last Name'
},{
xtype:'textfield',
fieldLabel: 'Age'
}]
},{
items: [{
xtype:'textfield',
fieldLabel: 'Id'
},{
xtype:'textfield',
fieldLabel: 'Address'
},{
xtype:'textfield',
fieldLabel: 'Sex'
}]
}],


buttons: [{
text: 'Submit',
handler: function() {
//TODO
}
}]
});

Unfortunately, the form contents are not getting displayed in the panel. Please help

Edit:

Ok i got it, moving the form above the panel will work. Thanks to the IDE for showing variable unused.

I have three panels and one button to submit. Is it possible that I will have three forms one for each panel and on submit button click, all the three form values will get submittd?

Please help

Regards,

scottmartin
21 Sep 2012, 9:23 PM
All items on the form will be submitted. The only exception would be a tabPanel and you can use deferredRender to solve that issue.

Also not that a form is a panel, so there is no need to insert this inside another panel.

Scott.