ExtJs—FormPanel居中.
初学ExtJs 在使用FormPanel时发现产生后在窗口的左上方，在API里找了下配置属性貌似没看到可以让FormPanel居中的
也许是有这个属性但是我没注意到，如果知道的朋友希望能给我说下
虽然没有找到居中的属性但是可以通过以下的方法使FormPanel居中
代码如下：
[xhtml] view plaincopy
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<title>Register</title>
<link rel=”stylesheet” type=”text/css” href=”../resources/css/ext-all.css”/>
<script type=”text/javascript” src=”../adapter/ext/ext-base.js”></script>
<script type=”text/javascript” src=”../ext-all.js”></script>
<style>
.main{
width:100%;
text-align:center;
vertical-align:center;
}
.login{
margin-left:auto;
margin-right:auto;
text-align:center;
width:500px;
height:200px;
}
</style>
<body>
<div class=”main” id=”main”>
<div class=”login” id=”login”></div>
</div>
<script type=”text/javascript”>
Ext.onReady(function(){
Ext.QuickTips.init();
// turn on validation errors beside the field globally
//Ext.form.Field.prototype.msgTarget = ‘side’;
var bd = Ext.getBody();
/*
* ================ Simple form =======================
*/
// bd.createChild({tag: ‘h2′, html: ‘Form 1 – Very Simple’});
var loginPanel = new Ext.FormPanel({
labelWidth: 75, // label settings here cascade unless overridden
url:’save-form.jsp’,
frame:true,
title: ‘用户登陆’,
bodyStyle:’padding:5px 5px 0′,
buttonAlign:’center’ ,
width: 400,
defaults: {width: 230},
defaultType: ‘textfield’,
items: [{
fieldLabel: ' 用户名',
name: 'uname',
allowBlank:false,
blankText:'用户名不能为空',
minLength:6,
minLengthText:'用户名的长度为[6-20]‘,
maxLength:20,
maxLengthText:’用户名的长度为[6-20]‘
},{
xtype: ‘textfield’,
inputType:’password’,
fieldLabel:’ 密 码’,
name:’pwd’,
allowBlank:false,
blankText:’密码不能为空’,
minLength:6,
minLengthText:’密码的长度为[6-20]‘,
maxLength:20,
maxLengthText:’密码的长度为[6-20]‘
}],
buttons: [{
text: 'Save'
},{
text: 'Cancel'
}]
});
loginPanel.render(“main”);
});
</script>
</body>
</html>