PDA

View Full Version : Panel Containing Form Doesn't display



TampaBay55
12 Oct 2012, 11:47 AM
Greetings All:

I am just now starting to dabble in the Sencha Touch 2 stuff and I have already run into a problem. I do realize that the posted code is not conventional nor it is structured properly; however, I am just exploring layouts and components at this point:


var frmLogin = Ext.create('Ext.form.Panel',{
url: 'app/data/login.php',
items:[{
xtype: 'textfield',
name: "loginid",
label: "User ID:",
required: true
},{
xtype: 'passwordfield',
name: "password",
label: "Password:",
required: true
}]
});


var pnlLogin = Ext.create('Ext.Panel',{
layout: 'fit',
width: 370,
height: 210,
layout: 'fit',
items:[frmLogin]
});


var pnlTitle = Ext.create('Ext.Panel',{
layout: 'fit',
width: 370,
height: 30,
html: 'Title Panel',
style: 'background-color: green;'
});


Ext.application({
launch: function(){
Ext.create('Ext.Panel',{
fullscreen: true,
layout: {
type: 'vbox',
align: 'center',
pack: 'center'
},
items:[pnlTitle,pnlLogin]
});
}
});


The pnlTitle Panel displays but the pnlLogin does not. If I remove the form from the panel then the panel displays. I don't understand the behavior.

mitchellsimoens
14 Oct 2012, 10:10 AM
You should not be creating instances of views before the launch method executes.