日期:2014-05-17  浏览次数:20730 次

ext.ajax异步提交html页面form表单非formPanel

1. ext的formPanel表单的提交很多人都知道,但是如何用ext提交html页面普通的表单?

?

2. 在这里提供小的例子代码简单就不提供文件了,现将代码贴给大家分享。

?

3. jsp代码如下只包含一个简单的form

?

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
	var contextPath="<%=request.getContextPath()%>";
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="ext-4.0.7/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-4.0.7/bootstrap.js"></script>
<script type="text/javascript" src="js/extjs3.js"></script>
</head>
<body>
	<form action="" id="userForm" method="post">
		c_nme:<input type="text" id="c_nme" name="c_nme"/><br/>
		c_sex:<input type="text" id="c_sex" name="c_sex"/><br/>
		<input type="button" onclick="saveUser()" value="submit">
	</form>
</body>
</html>

?

?

4. 提供js代码如下这里用struts1(struts2请自行配置url)

?

function saveUser() {
 Ext.Ajax.request({  
       url: contextPath+"/secured/cust/custController.do?method=saveUser",  
       method: "POST",
       form : 'userForm',//这里为html表单名(必须有)
       success: function (response, option) {  
           response = Ext.JSON.decode(response.responseText);  
           if (response.success == true) {  
               if (response.flag == true) {  
                   Ext.MessageBox.alert("提示", "保存信息成功!");  
                   Ext.getCmp('gridpanel').store.load();  //刷新列表
               }else { 
              	   Ext.MessageBox.alert("错误信息", "保存信息失败!");
               }  
           }else { Ext.MessageBox.alert("错误信息", response.msges); }  
       },  
       failure: function () { Ext.Msg.alert("提示", "保存失败<br>没有捕获到异常"); }  
       
    });  
}

?

5. 提供action中方法如下(这里没有连接数据库)

?

public ActionForward saveUser(ActionMapping iMapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response) {
		try {
			CustForm theForm = (CustForm) form;
			String name = theForm.getC_nme();
			String sex = theForm.getC_sex();
			System.out.println(name+" "+sex);
			response.setCharacterEncoding("UTF-8");
			response.setHeader("Cache-Control", "no-cache,must-revalidate");
			response.setHeader("Pragma", "no-cache");
			response.setDateHeader("Expires", 0);
			// json.put("state", 1); // 成功标志
			response.getWriter().print("{success :false,flag:true,msges:'测试'}");

		} catch (Exception e) {
			log.error(e.getMessage() + "删除table异常", e);
		}
		return null;
	}

?