简单记录一下开发中碰到的一些小问题,以便以后少走弯路。
一个formpanel写时碰到一个问题,因为不太熟悉API ,走了一很多弯路。
new Ext.form.FormPanel({
xtype:"form",
labelWidth:80,
labelAlign:"left",
layout:"form",
width:350,
height:550,
padding:"2px",
items:[
{
xtype:"fieldset",
layout:"form",
height:450,
items:[
{
xtype:"textfield",
fieldLabel:"登陆账号",
name:"account",
allowBlank:false,
blankText:'用户账号不能为空.',
vtype:"alphanum",
vtypeText: "请输入字母和数字",
anchor:"90%"
},
{
xtype:"textfield",
fieldLabel:"用户名",
name:"nickname",
allowBlank:false,
blankText:'用户名不能为空.',
vtype: "alphanum",
vtypeText: "请输入字母和数字",
anchor:"90%"
},
{
xtype:"textfield",
inputType:'password',
fieldLabel:"密码",
id:"password",
name:"password",
allowBlank:false,
blankText:'用户密码不能为空.',
anchor:"90%"
},
{
xtype:"textfield",
vtype: "ComparePW",
inputType:'password',
fieldLabel:"确认密码",
Compareid:"password",
id:"confirm",
name:"confirm",
anchor:"90%"
},
{
xtype : 'combo',
store : this.combStore('type',
this.mapping),
allowBlank:false,
blankText:'请选择用户类型.',
valueField : "value",
displayField : "name",
mode : 'local',
editable : false,
forceSelection : true,
triggerAction : 'all',
hiddenName : 'type',
fieldLabel : '用户类型',
emptyText : '选择',
name : 'user_type',
value : '',
anchor:"90%"
},
{
xtype:"textfield",
fieldLabel:"绑定账号",
name:"bind_account",
anchor:"90%"
},
{
xtype:"textfield",
fieldLabel:"邮箱",
name:"email",
vtype: "email",
vtypeText: "不是有效的邮箱地址",
anchor:"90%"
},
{
xtype:"textfield",
fieldLabel:"密码保护",
name:"verify",
anchor:"90%"
},
{
xtype:"textarea",
fieldLabel:"描述",
name:"remark",
anchor:"90%",
height:80
}
]
}
]
}
);
不加vtype的验证时很好,加了以后就成下图这样了。
把anchor:"100%"改成anchor:"90%"问题解决,因为如果要做验证的话,控件后面要加一个错误提示的图片,所以要留点空间给它。