index.js:
1 Ext.onReady(function(){
2 Ext.QuickTips.init() ;
3 Ext.form.Field.prototype.msgTarget = 'side' ;
4
5 var simpleForm = new Ext.FormPanel({
6 title : '用户登录' ,
7 frame : true ,
8 paint : true ,
9 width : 400 ,
10 autoHeight : true ,
11 labelWidth : 50 ,
12 buttonAlign : 'center' ,
13 labelAlign : 'left' ,
14 renderTo : Ext.getBody() ,
15 url : 'doLogin.jsp' ,
16 // standardSubmit : true , //以非ajax方式提交数据 默认为false
17 defaults : {
18 xtype : 'textfield' ,
19 width : 300
20 },
21 items : [
22 {
23 fieldLabel : '用户名',
24 id : 'user_name' ,
25 allowBlank : false ,
26 blankText : '请输入用户名' ,
27 name : 'user_name'
28 },{
29 fieldLabel : '密 码' ,
30 id : 'password' ,
31 inputType : 'password' ,
32 allowBlank : false ,
33 blankText : '请输入密码' ,
34 name : 'password'
35 }
36 ],
37 buttons : [
38 {
39 text : '一般方式',
40 handler : function(){
41 if(simpleForm.form.isValid()){ //getForm /form isValid()执行验证
42 var form = simpleForm.getForm().getEl().dom ;
43 form.action = 'doLogin.jsp' ;
44 form.submit();
45 }
46 }
47 },{
48 text : 'ajax方式', //默认是ajax方式提交数据
49 handler : function(){
50 if(simpleForm.form.isValid()){
51 simpleForm.getForm().submit({
52 url : 'doLogin.jsp' ,
53 waitMsg : '正在提交,请稍等……',
54 timeout : 100000,
55 method : 'GET' ,
56 reset : true , //当提交后清空输入域的值
57 success : function(form,action){
58 var msg = action.result.msg ; //json格式数据 result中包含返回的值
59 alert(msg) ;
60 },
61 failure : function(form,action){
62 var msg = action.result.msg ;
63 alert(msg) ;
64 }
65 })
66 }
67 }
68
69 },{
70 text : '重置' ,
71 handler : function(){
72 simpleForm.form.reset();
73 }
74 }
75 ],
76 listeners : {
77 'beforeaction' : function(form,action){
78 form.baseParams = {'id' : 'id'} ; //向后台传递参数
79 },
80 'actioncomplete' : function(form,action){ //action执行完成
81 alert('actioncomplete') ;
82 },
83 'actionfalture' : function(form,action){ //action失败
84 alert('actionfalture') ;
85 }
86 }
87
88 }) ;
89 })
doLogin.jsp:
1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
2 <%@page import="java.io.PrintWriter"%>
3 <%@page import="net.sf.json.JSONObject"%>
4
5 <%
6 String user_name = request.getParameter("user_name") ;
7 String password = request.getParameter("password") ;
8
9 String id = request.getParameter("id") ; //从baseParams中的参数
10 System.out.println(id) ;
11
12 String json = "" ;
13 Map map = new HashMap() ;
14 if("hello".equals(user_name)&&"world".equals(password)){
15 map.put("msg","提交数据成功,用户名:"+user_name+"密码:"+password) ;
16 map.put("success",true) ; //以ajax方式提交数据要有该数据,数据成功
17 }else{
18 map.put("msg","提交数据失败");
19 map.put("success",true) ;
20 }
21
22 JSONObject jsonObject = JSONObject.fromObject(map) ;
23 json = jsonObject.toString() ;
24 System.out.print(json) ;
25 response.getWriter().print(json);
26
27 %>
28
上面是formPanel简单的数据往后台提交的方法,供以后参考使用s