struts2中使用ajax
为了写一个struts2配合使用的ajax，的确是花了不少心思，总是提出各种各样的问题，究其原因是——包冲突；因为自己配置的jar是很久以前的，所以很多包都不支持，因此自己在网上下载了最新想版本 struts-2.3.7，将需要的包放在附件中，废话不多说了，开始整理ajax吧
<?xml version="1.0" encoding="GBK"?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0 //EN" "resources/struts-2.1.7.dtd"> <struts> <constant name="struts.i18n.encoding" value="utf-8"></constant> <constant name="struts.multipart.maxSize" value="10000000" /> <package name="ajax" extends="json-default"> <action name="ajaxTest" class="ajaxTestSpring"> <result name="success" type="json"></result> </action> </package> </struts>
在spring中配置对应的处理action类
<!-- 测试使用的ajax --> <bean id="ajaxTestSpring" class="hb.ajax.AjaxTest"></bean>
前端发送ajax请求
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'ajax.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="<%=basePath%>js/util/jquery-1.4.4.js"></script>
</head>
<body>
<button onclick="test1()">ajax简单入门</button><br>
<button onclick="test2()">ajax 接受对象</button><br>
<button onclick="test3()">ajax 接受多个对象</button><br>
</body>
</html>
<script>
function test1(){
$.ajax({
type:"post",
url:"<%=basePath%>ajaxTest.action",
data: "name=John&location=Boston",
success:function(data){
alert(data.name);
},
error:function(){
alert("error");
}
});
}
function test2(){
$.ajax({
type:"post",
url:"<%=basePath%>ajaxTest.action",
data: "name=Johns&location=Boston",
success:function(data){
alert(data.name);
alert(data.person.password);
},
error:function(){
alert("error");
}
});
}
function test3(){
$.ajax({
type:"post",
url:"<%=basePath%>ajaxTest.action",
data: "name=Johnlist&location=Boston",
success:function(data){
alert(data.persons[1].password);
},
error:function(){
alert("error");
}
});
}
</script>
对应的java处理类
package hb.ajax;
import java.util.Date;
import java.util.LinkedList;
import java.util.List;
import hb.person.model.Person;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxTest extends ActionSupport{
String name;
Person person;
List<Person> persons;
public List<Person> getPersons() {
return persons;
}
public Person getPerson() {
return person;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
@Override
public String execute() throws Exception {
System.out.println(this.name);
if(this.name.equals("John")){
this.name="ajax 测试成功";
}
if(this.name.equals("Johns")){
this.name="ajax 测试成功";
this.person = new Person();
person.setAge(12);
person.setBirthday(new Date());
person.setName("测试ajax");
person.setPassword("我是密码");
}
if(this.name.equals("Johnlist")){
this.name="ajax 测试成功";
Person person1 = new Person();
person1.setAge(12);
person1.setBirthday(new Date());
person1.setName("测试ajax");
person1.setPassword("我是密码");
Person person2 = new Person();
person2.setAge(122);
person2.setBirthday(new Date());
person2.setName("测试ajax2");
person2.setPassword("我是密码2");
this.persons = new LinkedList<Person>();
persons.add(person1);
persons.add(person2);
}
return "success";
}
}
备注：对应的action中的属性需要有get方法，这样才能保证前端得到对应的json数据，三个ajax分别json内容
1、{"name":"ajax 测试成功"}
2、{"name":"ajax 测试成功","person":{"age":12,"birthday":当前时间toString,"name":"测试ajax","password":"我是密码"}}
3、{"name":"ajax 测试成功","persons":[{"age":12,"birthday":当前时间toString,"name":"测试ajax","password":"我是密码"},{"age":122,"birthday":当前时间toString,"name":"测试ajax2","password":"我是密码2"}]}