日期:2014-05-16  浏览次数:20337 次

extjs和java后台间的交互(登录实例)
一个login.jsp界面
一个ext_login.js:
Ext.onReady(function(){
	Ext.QuickTips.init(); //初始化信息提示
	var form = new Ext.FormPanel({
		title:'user login',
		width:'240px',
		height:'200px',
		renderTo:'loginDiv',
		frame:true,
		labelWidth:50,
		labelAlign:'right',
		items:[{
			id:'username',    //为输入框加个id
			xtype:'textfield',
			name:'username',
			fieldLabel:'account',
			allowBlank:false,
			blankText:'account cannot be null'
		},{
			id:'password',  
			xtype:'textfield',
			name:'password',
			inputType:'password',
			fieldLabel:'password',
			allowBlank:false,
			blankText:'account cannot be null'
		}],
		buttons:[{
			text:'login',
			id:'mybutton',
			listeners:{    //关键:btn的click函数
				"click":function(){
					if(form.getForm().isValid()){
						Ext.Ajax.request({
							method:'post',
							url:'ajaxLoginServer.jsp',
							params:{
								username:Ext.getCmp('username').getValue(),  //获得filefield中的值
								password:Ext.getCmp('password').getValue()
							},
							callback:function(options,success,response){
								Ext.Msg.alert('notice',response.responseText);
							}
						});
					}
				}
			}
		}]
	});
	form.show();
});

一个ajaxLoginServer:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<% 
	String username =  request.getParameter("username");
	String password = request.getParameter("password");
	if(username == null){response.getWriter().write("username == null");}
	if(username.equals("")){response.getWriter().write("username.equals-null");}
	if(username.equals("guanlin") && password.equals("123")){
		response.getWriter().write("success!");
	}else{
		response.getWriter().write("failed! nihao" + username);
	}
%>