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);
});