struts2实现ajax功能

最新推荐文章于 2021-08-06 12:49:40 发布

Java红桃峰峰日拱一卒

最新推荐文章于 2021-08-06 12:49:40 发布

阅读量6.5k

点赞数 2

分类专栏： struts2 文章标签： servletAPI获取ajax struts2 ajax struts2实现ajax功能 struts2实现json

本文链接：https://blog.csdn.net/u011159417/article/details/73917929

版权

struts2 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

在struts2项目中，我们也会使用到ajax功能，有两种方式来实现ajax功能，一种是可以使用servletAPI来实现ajax的功能，另一种是使用struts2的插件来实现，

下面我们先来写一个简单的

在struts2项目中使用servletAPI实现ajax功能

demo来演示一下ajax功能。

项目结构：

index.jsp页面代码：

<%@ 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 'index.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="js/jquery-3.2.1.js"></script>
<script type="text/javascript">
	$(function(){
		$('#btn').click(function(){
			$.post("ajax.action" , function(data){
				$("#msg").html(data) ;
			}) ;
		});
	}) ;


</script>


</head>

<body>
	<input type="button" id="btn" value="获取ajax信息" />
	<h3 id="msg"></h3>
	<br>
</body>
</html>

点击“获取ajax信息按钮”，在js中，通过jQuery来获取button事件然后使用post请求，从Action类中获取信息，展示在h3标签中。

AjaxAction.java代码：

package com.robert.action;

import java.io.IOException;

import javax.servlet.http.HttpServletResponse;

import org.apache.struts2.ServletActionContext;

public class AjaxAction {

	public String execute() throws IOException {
		HttpServletResponse resp = ServletActionContext.getResponse() ;
		
		resp.setCharacterEncoding("utf-8") ;
		resp.getWriter().print("struts ajax") ;
		
		return null ;
	}
	
}

struts.xml代码：

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
    "http://struts.apache.org/dtds/struts-2.3.dtd">

<struts>
	<package name="default" namespace="/" extends="struts-default">
		<action name="ajax" class="com.robert.action.AjaxAction">
			
		</action>
	</package>
</struts>

在浏览器中输入URL；http://localhost:8080/ajax/index.jsp，获得如下页面：

点击获取ajax信息按钮，

struts ajax 字符串是AjaxAction类中的

		HttpServletResponse resp = ServletActionContext.getResponse()
		resp.setCharacterEncoding("utf-8") ;
		resp.getWriter().print("struts ajax") ;

response返回的信息，说明ajax成功。

下面我们来看一下怎么

使用struts2插件来实现ajax

项目结构：

struts2实现ajax功能，需要使用插件来实现，插件一共有两个，如图，图中红框中的两个便是struts2实现ajax时，使用的json包

其中还有一个json-lib-2.3-jdk15.jar包，这个包中有JSONArray类，有的程序中由于包不对，还有可能报一些错误，

如：java.lang.ClassNotFoundException:org.apache.commons.lang.exception.NestableRuntimeException,

java.lang.NoClassDefaultError:org/apache/commons/collections/map/ListOrderedMap.

我这里遇到了两个，如图：

这两个都是由于jar的原因，我导入了commons-lang-2.4.jar和commons-collections-3.2.2.jar后，问题就解决了。

json.jsp页面代码：

<%@ 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 'index.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="js/jquery-3.2.1.js"></script>
<script type="text/javascript">
	$(function(){
		$('#btn').click(function(){
			$.post("json.action" , function(data){
				var html = "" ;
				for(var i=0;i<data.length;i++) {
					html += "<tr><td>"+data[i].name+"</td><td>"+data[i].age+"</td></tr>" ;
				}
				$('#content').html(html) ;
			},'json') ;
		});
	}) ;


</script>


</head>

<body>
	<input type="button" id="btn" value="获取json信息" />
	<table width="80%" align="center">
		<tr>
				<td>姓名</td>
				<td>年龄</td>
		</tr>
		<tbody id="content">
			
		</tbody>
	</table>
	<br>
</body>
</html>

struts.xml配置代码：

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
    "http://struts.apache.org/dtds/struts-2.3.dtd">

<struts>
	<package name="default" namespace="/" extends="json-default">
		<action name="ajax" class="com.robert.action.AjaxAction">
		</action>
		<action name="json" class="com.robert.action.JsonAction">
			<result type="json">
				<!-- param里面name=“root”必须这样写，后面的那个root是JsonAction中的JSONArray的变量root -->
				<param name="root">root</param>
			</result>
		</action>

	</package>
</struts>

JsonAction.java中的代码：

package com.robert.action;

import java.util.ArrayList;
import java.util.List;

import net.sf.json.JSONArray;

import com.opensymphony.xwork2.Action;
import com.robert.entity.User;

public class JsonAction {

	private JSONArray root;
	
	public String execute() {
		List<User> list = new ArrayList<User>() ;
		list.add(new User("robert", 20)) ;
		list.add(new User("jie", 19)) ;
		list.add(new User("jing", 22)) ;
		root = JSONArray.fromObject(list) ;
		System.out.println("root="+root.toString());
		return Action.SUCCESS ;
	}

	public JSONArray getRoot() {
		return root;
	}

	public void setRoot(JSONArray root) {
		this.root = root;
	}

}

User.java代码：

package com.robert.entity;

public class User {

	private String name;
	private int age;
	
	public User(String name, int age) {
		super();
		this.name = name;
		this.age = age;
	}

	public int getAge() {
		return age;
	}

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

	public String getName() {
		return name;
	}

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

	
}

浏览器中输入URL：http://localhost:8080/ajax/json.jsp ，点击“获取json信息”按钮