Ajax+struts2+json进行对象list前后端传递

我们在处理前后端数据的传递过程中，经常需要从前台传入大量的数据信息与后台进行交互。

那么ajax在其中起到了关键的作用，配后后端的mvc框架，使用json信息传输信息。

在这个过程中需要将前端的对象传递至后端，本文就来介绍一下这一过程

首先js代码中我们构建一个数据对象

var dataObj = {
"data" : [ {
"active" : "true",
"color" : "orange",
"date" : "2008-01-01",
"id" : "1",
"name" : "Chris"
}, {
"active" : "false",
"color" : "blue",
"date" : "2013-03-03",
"id" : "2",
"name" : "Kate"
}, {
"active" : "true",
"color" : "black",
"date" : "2013-05-03",
"id" : "3",
"name" : "Blade"
}, {
"active" : "false",
"color" : "yellow",
"date" : "2013-01-01",
"id" : "4",
"name" : "Zack"
} ]
};

然后将js对象转成JSON的格式，

这里的JSON.stringify()方法就是用来将js对象转化成JSON的。

var data1 = JSON.stringify(dataObj);

调用$.ajax()进行传递

$.ajax({
url : "writeJSON.action",//调用后台action
data : data1,//上面需要传递的对象信息
dataType : 'json',
contentType : 'application/json',
type : 'POST',
async : true,
success : function(res) {//调用成功后返回的信息
console.log(res.data.length);
for(var i=0; i<res.data.length;i++){
alert(" "+res.data[i].name+"-"+res.data[i].id+"-"+res.data[i].active+"-"+res.data[i].date);
}
}
});
}

这样前台发送的信息我们已经编写完成，现在需要编写后台java代码。

由于后台我们用到了strtus2框架，这里需要配置web.xml和struts.xml

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
<display-name>struts2JSON</display-name>

<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
</web-app>

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.action.extension" value="action,pdf" />
<constant name="struts.i18n.reload" value="true" />
<constant name="struts.configuration.xml.reload" value="true" />
<constant name="struts.custom.i18n.resources" value="i18n/ap,application" />
<constant name="struts.date.format" value="yyyy-MM-dd" />
<constant name="struts.serve.static" value="true" />
<constant name="struts.serve.static.browserCache" value="false" />

<package name="default" namespace="/" extends="json-default">

<interceptors>
<interceptor-stack name="defaultStack">
<interceptor-ref name="json">
<param name="enableSMD">true</param>
</interceptor-ref>
</interceptor-stack>
</interceptors>
<default-interceptor-ref name="defaultStack" />

<action name="writeJSON" class="com.test.json.ReadJSON" method="writeJSON">
<result type="json" />
</action>
</package>
</struts>

同时需要一个javaBean用来接收前端传来的json数据，这里要注意一下，javaBean的各个变量命名要和json数据各个变量的命名一致。

Report.java

package com.test.json;

public class Report {
private int id;
private String name;
private boolean active;
private String date;
private String color;

public Report(){
System.out.println("Inside Constructor with 0 arguments");
}

public Report(int id,String name,boolean active,String date,String color){
this.active=active;
this.id=id;
this.name=name;
this.color=color;
this.date=date;
}

public int getId() {
return id;
}

public void setId(int id) {
this.id = id;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public boolean isActive() {
return active;
}

public void setActive(boolean active) {
this.active = active;
}

public String getDate() {
return date;
}

public void setDate(String date) {
this.date = date;
}

public String getColor() {
return color;
}

public void setColor(String color) {
this.color = color;
}

}

下面是关键的action部分了

ReadJSON.java

package com.test.json;

import java.util.ArrayList;
import java.util.List;
import com.rajesh.json.Report;
import com.opensymphony.xwork2.ActionSupport;

public class ReadJSON extends ActionSupport {

private static final long serialVersionUID = -6765991741441442190L;
//此处定义对象，data为接收的json对象
private List<Report> data;

public String readJSON() {
try {
System.out.println(data.size());

for (int i = 0; i < data.size(); i++) {
System.out.println("Data  " + data.get(i).getColor() +"-"+ data.get(i).getDate() +"-"+ data.get(i).getId()+"-"+ data.get(i).getName());
}

System.out.println("Execute Method");
} catch (Exception e) {
e.printStackTrace();
}
return SUCCESS;
}
//一定要有get和set方法
public List<Report> getData() {
return data;
}

public void setData(List<Report> data) {
this.data = data;
}

}

这样一个Ajax+struts2+json进行对象list前后端传递的简单demo就完成了。