struts2 + ajax（由前臺的form提交數據到後臺，再根據form所調用返回獲取的後臺json格式的數據返回到前端，而後前端用jquery對json數據進行解析）==》》涉及非文件上傳的部分

時間 2019-11-26

標籤 struts2 struts ajax 前臺 form 提交數據後臺根據調用返回獲取 json 格式前端而後 jquery 進行解析涉及文件上傳部分欄目 Struts 简体版

原文原文鏈接

struts2 + ajax + form 表單提交的處理，若是不是文件上傳的部分，就能夠直接用ajax來實現，而不是像以前用iframe來仿ajax數據交互的方法。javascript

用Ajax.Request()方法來實現！！html

例子：java

前臺代碼：ajax

<%@ 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>

後臺代碼：apache

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：json

<?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的異步數據請求交互。服務器