踏上原路

  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

struts2 + ajax + form 表单提交的处理,如果不是文件上传的部分,就可以直接用ajax来实现,而不是像之前用iframe来仿ajax数据交互的方法。

用Ajax.Request()方法来实现!!

例子:

前台代码:

<%@ 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>使用JSON插件</title>

<script type="text/javascript" src="prototype-1.6.0.3.js"></script>

<script type="text/javascript" src="json2.js"></script>

<script type="text/javascript">

	function gotClick(){
		
		//请求的地址
		var url = 'JSONExample.action';
		
		//将favorite表单域的值转换为请求参数
		var params = Form.serialize('form1');
		
		//创建Ajax.Request对象,对应于发送请求
		var myAjax = new Ajax.Request(
				url,
				{
					//请求方式:POST
					method:'post',
					
					//请求参数
					parameters:params,
					
					//指定回调函数
					onComplete:processResponse,
					
					//是否异步发送请求
					asynchronous:true
				});
		
	}
	
	
	//作为ajax的回调函数
	function processResponse(request){
		
		//使用JSON对象将服务器响应解析成JSON对象
		var res = JSON.parse(request.responseText);
		
		//遍历JSON对象的每个属性
		for(var propName in res){
			$("show").innerHTML += propName + " --> " +
				res[propName] + "<br />";
		}
	}
</script>

</head>
<body>


<form id="form1" name="form1" method="post">
	field1:<input type="text" name="field1" id="field1" /><br>
	field2:<input type="text" name="field2" id="field2" /><br>
	field3:<input type="text" name="field3" id="field3" /><br>
	<input type="button" value="提交" onclick="gotClick();" />
</form>

<div id="show"></div>


</body>
</html>

 

后台代码:

package action;

import java.util.HashMap;
import java.util.Map;

import org.apache.struts2.json.annotations.JSON;

import com.opensymphony.xwork2.ActionSupport;

@SuppressWarnings({ "rawtypes", "serial" })
public class JSONExample extends ActionSupport {

	//模拟处理结果的属性
	private int[] ints = {10,20};
	
	
	private Map map = new HashMap();
	
	private String customName = "顾客";
	
	
	//封装请求参数的三个属性
	private String field1;
	
	//transient修饰的属性不会被序列化
	private transient String field2;
	
	private String field3;
	
	
	
	@SuppressWarnings("unchecked")
	@Override
	public String execute() throws Exception {
		map.put("name", "李刚");
		return SUCCESS;
	}
	
	
	

	public int[] getInts() {
		
		System.out.println("getInts()被调用");
		
		return ints;
	}

	public void setInts(int[] ints) {
		System.out.println("setInts()被调用");
		
		this.ints = ints;
	}

	//使用注释语法来改变该属性序列化后的属性名
	@JSON(name="newName")
	public Map getMap() {
		System.out.println("getMap()被调用");
		
		return map;
	}

	public void setMap(Map map) {
		System.out.println("setMap()被调用");
		
		this.map = map;
	}

	public String getCustomName() {
		System.out.println("getCustomName()被调用");
		
		return customName;
	}

	public void setCustomName(String customName) {
		System.out.println("setCustomName()被调用");
		
		this.customName = customName;
	}

	
	
	
	
	public String getField1() {
		System.out.println("getField1()被调用");
		
		return field1;
	}

	public void setField1(String field1) {
		System.out.println("setField1()被调用");
		
		this.field1 = field1;
	}

	public String getField2() {
		System.out.println("getField2()被调用");
		
		return field2;
	}

	public void setField2(String field2) {
		System.out.println("setField2()被调用");
		
		this.field2 = field2;
	}

//	public String getField3() {
//		return field3;
//	}
//
//	public void setField3(String field3) {
//		this.field3 = field3;
//	}
	
	
	
}

 

配置struts.xml:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>
	
	<constant name="struts.i18n.encoding" value="UTF-8" />
	
	<package name="json" extends="json-default">
		<action name="JSONExample" class="action.JSONExample">
			<result type="json"></result>
		</action>
		
		<action name="">
			<result>.</result>
		</action>
	</package>


</struts>

 从而实现ajax的异步数据请求交互。

posted on 2013-07-24 01:37  踏上原路  阅读(2617)  评论(0编辑  收藏  举报