login.js

Spring+acegi+ext2.0+mysql 开发 acegi做权限控制 ext2.0做前台显示 spring 做控制层 mysql 做数据库

	LoginPanel=function(){
	var win ,f;
	var buildForm=function(){
		f=new Ext.form.FormPanel({
			bodyStyle:'padding-top:6px',
			defaultType:'textfield',
			labelAlign:'right',
			labelWidth:55,//标签的默认长度
			labelPad:0,//标签与字段录入框之间的空白
			frame:true,//窗口是否显示背景色
			defaults:{//容器中组件默认统一配置选项
				allowBlank:false,
				width:158
			},
			items:[{
				cls:'user',//给元素添加CSS样式
				name:'userName',
				fieldLabel:'帐号',
				blankText:'帐号不能为空'
			},{
				cls:'key',
				name:'userPass',
				fieldLabel:'密码',
				blankText:'密码不能为空',
				inputType:'password'
			}]
		});	
	};
	var buildWin=function(){
		win=new Ext.Window({//创建一个窗口面板容器
			el:'win',//把该面板绑定与win这个div对象上
			title:'登录系统',
			width:265,
			height:140,
			layout:'column',
			collapsible:true,//面板是否可以关闭及打开
			defaults:{
				border:false//容器内元素是否显示边框
			},
			items:{
				columnWidth:1,//指定内部元素所占宽度
				items:f
			},
			keys:[{ //处理键盘回车事件  
                key:[10,13],  
                fn:login,
                scope:this
            }],
			buttonAlign:'center',//面板中按钮的排列方式
			buttons:[{
				text:'登录',
				handler:login
			},{
				text:'重置',
				handler:reset
			}]
		});
	};
	//单击按钮时执行登录操作
	var login=function(){
		f.form.submit({
			waitMsg:'正在登录......',//动作发生期间显示的文本信息
			url:'login.do?reqCode=login',
			method:'POST',
			success:function(form,action){//数据验证通过是发生的动作
				window.location.href='welcome.html';
			},
			failure:function(form,action){
				reset();
				if(action.failureType==Ext.form.Action.SERVER_INVALID)
					Ext.MessageBox.alert('警告',action.result.errors.msg);
			}
		});
	};
	//清空当前表单面板内的数据
	var reset=function(){
		f.form.reset();
	};
	return{
		init:function(){
			buildForm();
			buildWin();
			win.show();
		}
	}
}();
Ext.onReady(LoginPanel.init,LoginPanel);