extjs实现用户登录界面

extjs实现用户登录界面.只有视图层。

Ext.onReady(function()
{
	Ext.QuickTips.init();
	
	var loginForm=new Ext.FormPanel
	({
		standardSubmit: true, 
		url:'test.jsp',
		renderTo:document.body,
		frame:true,
		title:'用户登陆',
		width:400,
		items:[
			{
				xtype:'textfield',
				fieldLabel:' 用户名 ',
				name:'uname',
				width:180,
				
				allowBlank:false,
				blankText:'用户名不能为空',
				minLength:6,
				minLengthText:'用户名的长度为[6-20]',
				maxLength:20,
				maxLengthText:'用户名的长度为[6-20]'
				
			},
			{
				xtype: 'textfield',   
				inputType:'password', 
				fieldLabel:'密    码',
				name:'pwd',
				width:180,
				
				allowBlank:false,
				blankText:'密码不能为空',
				minLength:6,
				minLengthText:'密码的长度为[6-20]',
				maxLength:20,
				maxLengthText:'密码的长度为[6-20]'
			},
			{
				xtype: 'textfield', 
				fieldLabel:'验证码',
				name:'val',
				width:80,
				
				allowBlank:false,
				blankText:'验证码不能为空'
			}
		],
		buttons: [
	        { 
	        	text: '登录', 
	        	type:'button',
				handler:function()
	        	{
	        		if (!loginForm.getForm().isValid()) return;
	        		
	        		loginForm.getForm().submit();

	        	}  
	        }
        ]
		
	});
}
);

 只要注意其中的standardSubmit: true,否则页面就不能实现跳转了，因为extjs默认是AJAX方式提交的。