ExtJS 在Panel的Center一部分显示FormPanel里的内容

ExtJS 在Panel的Center部分显示FormPanel里的内容
var login = function() {
Ext.QuickTips.init();
Ext.lib.Ajax.defaultPostHeader += ";charset=utf-8";
// Ext.state.Manage.setProvider(new Ext.state.CookieProvider());

var panel = new Ext.Panel({
renderTo : 'loginpanel',
layout : "border",
width : 525,
height : 290,
defaults : {
border : false
},
items : [{
region : "north",
height : 58,
html : '<img src="images/head.jpg"/>'
}, {
region : "south",
height : 61,
html : '<img src="images/foot.jpg"/>'
}, {
region : "west",
width : 257,
html : '<img src="images/left.jpg"/>'
}, {
region : "center",
html : '<img src="images/center.jpg"/>'
}]
});
Ext.get('loginpanel').setStyle('position', 'absolute')
.center(Ext.getBody());

var form = new Ext.form.FormPanel({
// renderTo:'loginpanel',
defaultType : 'textfield',
labelAlign : 'right',
labelWidth : 60,
region : "center",
defaults : {
border : false
},
items : [{
fieldLabel : '登录账号',
name : "adminaccount"
}, {
fieldLabel : '登录密码',
inputType : 'password',
name : 'adminpassword'
}, {
fieldLabel : '验 证 码',
name : 'checkcode'
}],
buttons : [{
text : '登录'
}, {
text : '重置'
}]
});

};
Ext.onReady(login);

我想要用FormPanel的东西显示在Panel的Center部分，但始终没显示出来。。。。