Ext 入门的容易 formPanel ②

Ext.onReady(function() {
	//	动态切换图片，不赋值，讲联网ext官网查询
	Ext.BLANK_IMAGE_URL = '../ext-2.2/resources/images/default/s.gif';
	//	初始化信息提示框	
	Ext.QuickTips.init();
	// turn on validation errors beside the field globally
	//	定义统一错误提示的样式 1、qtip 2、title 3、under 4、side
	Ext.form.Field.prototype.msgTarget = 'side';
	var bd = Ext.getBody();
	/* * ================ Simple form ======================= */
	bd.createChild({
				tag : 'h2',
				html : '简单的 form panel'
			});
	var formPanel = new Ext.form.FormPanel({
			title:'Ext.form.FormPanel',
			height:400,
			width:800,
			frame:true,
			labelSeparator:':',
			labelWidth:60,
			labelAlign:'right',
			items:[
				new Ext.form.TextField({
					fieldLabel:'userName',
					allowBlank:false,
					blankText:'填写姓名'
				}),
				new Ext.form.NumberField({
					fieldLabel:'age',
					allowBlank:false,
					blankText:'填写年龄',
					emptyText:'age',
					maxLength:2,
					maxLengthText:'不能超过100岁',
					baseChars:'789'//接受有效数字的一组基础字符
					//msgTarget:'qtip'
				}),
				new Ext.form.TextArea({
					id:'textAreaId',
					width:150,
					fieldLabel:'remark'
				}),
				new Ext.form.Checkbox({	// checkbox、radio 横排
					name:'cb1',
					fieldLabel:'爱好',
					boxLabel:'游泳',
					checked:true,
					readOnly:true
				}),
				new Ext.form.Checkbox({
					name:'cb2',
					boxLabel:'爬山',
					disabled:true
				}),
				new Ext.form.Checkbox({
					name:'cb3',
					boxLabel:'旅游'
				}),
				new Ext.form.Radio({ // checkbox、radio 横排
					name:'sex',
					fieldLabel:'性别',
					boxLabel:'男'
				}),
				new Ext.form.Radio({
					name:'sex',
					boxLabel:'女',
					hiddenLabel:true
				}),//触发字段
				new Ext.form.TriggerField({
					id:'trigerFieldId',
					fieldLabel:'触发字段',
					hideTrigger:false,
					onTriggerClick:function(e){
						alert(formPanel.findById('trigerFieldId').getValue());
					}
				})
			],
			buttons:[{
				text:'btn1',
				handler:showValue
			}]
			});
		function showValue(){
			var ta = formPanel.findById('textAreaId');
			alert(ta.getValue());
		}
	formPanel.render(document.body);
});