您的位置:首页 > Web前端 > JQuery

struts2+jquery实现ajax异步提交并返回json串

2016-01-22 13:52 525 查看
rt.

一、环境准备struts2.3+jquery1.12+jackson1.9

除了struts2核心jar包外,还需下载struts2-json-plugin.jar,否则运行报错!!!

二、代码

testAJAX.jsp

<%@ 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>struts2+jquery</title>
</head>

<body>
<div>
<h5>录入数据</h5>
<br />
<form action="#" method="post">
<label>姓名:</label><input type="text" name="name" /> <label>年龄:</label><input
type="text" name="age" /> <label>职务:</label><input
type="text" name="position" /> <input type="button" class="btn"
value="提交结果" />
</form>
<br />
<h5>显示结果</h5>
<br />
<ul>
<li>姓名:<span id="s_name">none</span></li>
<li>年龄:<span id="s_age">none</span></li>
<li>职务:<span id="s_position">none</span></li>
</ul>
</div>

<script type="text/javascript" src="jquery/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
/* 页面加载完成,绑定事件 */
$(document).ready(function() {
btn();
});

/* 提交结果,执行ajax */
function btn() {
var $btn = $("input.btn");//获取按钮元素
//给按钮绑定点击事件
$btn.bind("click", function() {
$.ajax({
type : "post",
url : "excuteAjaxJsonAction",//需要用来处理ajax请求的action,excuteAjax为处理的方法名,JsonAction为action名
data : {//设置数据源
name : $("input[name=name]").val(),
age : $("input[name=age]").val(),
position : $("input[name=position]").val()
},
dataType : "json",//设置需要返回的数据类型
success : function(data) {
alert("data=" + data);
var d = eval("(" + data + ")"); //将数据转换成json类型,可以把data用alert()输出出来看看到底是什么样的结构
alert("d.length=" + d.length);
$("#s_name").text("" + d[0].name + "");
$("#s_age").text("" + d[0].age + "");
$("#s_position").text("" + d[0].posititon + "");
},
error : function() {
alert("exception.");
}
});
});
}
</script>
</body>
</html>


JsonAction.java

有一部分代码是做测试用,可以自动忽略。

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.apache.log4j.Logger;
import org.codehaus.jackson.map.ObjectMapper;

import com.wyglxt.base.BaseAction;

public class JsonAction extends BaseAction {
private static final long serialVersionUID = 7951770011065306314L;
private static final Logger log = Logger.getLogger(JsonAction.class);

private String result;
private String name;
private String age;
private String position;

/**
* 处理ajax请求
*
* @return SUCCESS
*/
public String excuteAjax() {

try {
// 将数据存储在map里,再转换成json类型数据,也可以自己手动构造json类型数据
Map<String, Object> map = new HashMap<String, Object>();
map.put("name", name);
map.put("age", age);
map.put("position", position);
Test test = new Test();
test.setAge(age);
test.setName(name);
test.setPosititon(position);
List<Test> list = new ArrayList<Test>();
list.add(test);

// 将map对象转换成json类型数据
// JSONObject json = JSONObject.fromObject(map);
ObjectMapper mapper = new ObjectMapper();
// JsonGenerator generator =
// mapper.getJsonFactory().createJsonGenerator(System.out,
// JsonEncoding.UTF8);
// 给result赋值,传递给页面
setResult(mapper.writeValueAsString(list));
log.info(result);
} catch (Exception e) {
e.printStackTrace();
}
return SUCCESS;
}

public String getResult() {
return result;
}

public void setResult(String result) {
this.result = result;
}

public String getName() {
return name;
}

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

public String getAge() {
return age;
}

public void setAge(String age) {
this.age = age;
}

public String getPosition() {
return position;
}

public void setPosition(String position) {
this.position = position;
}
}

class Test {
private String name;
private String age;
private String posititon;

public String getName() {
return name;
}

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

public String getAge() {
return age;
}

public void setAge(String age) {
this.age = age;
}

public String getPosititon() {
return posititon;
}

public void setPosititon(String posititon) {
this.posititon = posititon;
}

}


struts.xml

这里需要注意:package必须从json-default继承而不是struts-default继承,否则程序启动报错,或者在package中添加result-type,形如:

<result-types>
<result-type name="json" class="org.apache.struts2.json.JSONResult"/>
</result-types>


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

<package name="default" namespace="/" extends="json-default">
<!-- for json -->
<action name="*JsonAction" method="{1}"
class="com.wyglxt.action.JsonAction">
<!-- 返回json类型数据 -->
<result type="json">
<param name="root">result<!-- result是action中设置的变量名,也是页面需要返回的数据,该变量必须有setter和getter方法 --></param>
</result>
</action>
</package>

</struts>


三、运行效果:





end.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: