plugin实现Struts2的Ajax功能并利用JSON传递数据

上次在《【Struts2】利用JQuery实现Struts2的Ajax功能》(点击打开链接)已经提及过Struts2除了《【Struts2】Struts2纯手工安装、配置以及Helloworld,以最新版struts 2.3.20 GA做例子》(点击打开链接)中保证Struts2的项目启动的核心包之外,再也不用其它的包就可以配合JQuery或者其他javascript插件,甚至javascript的本身就可以实现Ajax功能了。在Struts2中传递JSON并不需要外带一些关于Java的JSON解析包,在下好的struts-2.3.20-all.zip解压后,在lib文件夹中找到struts2-json-plugin-2.3.20.jar之后,连同struts2的核心jar包拷贝到你的网络工程的文件夹,便可以在使用Struts2的Ajax功能的时候,利用JSON传递数据。

一、基本目标

下面便用一个小例子来说明Struts2中,在Ajax技术的基础上,如何利用JSON来传递数据。

如下图所示,在一个网页中有两个文本框,一个是text1,一个是text2。点击提交按钮之后,则向后台的JAVA文件发送数据。

后台对text1的字符串进行加工,后返回前端,同时再向前端返回一个只出不进的text3。并且在控制台输出text2的值。

打开Google的网页数据分析器可以看到,后端向前端返回了一个JSON,内容只有text1,text3,这个JSON还无须利用eval去解析,直接就能够适用了。

二、基本准备

除了如同像《【Struts2】Struts2纯手工安装、配置以及Helloworld,以最新版struts 2.3.20 GA做例子》(点击打开链接)一样,准备好一个Struts2工程所需的一切,包括各种各样的lib与web.xml,再从放进把struts-2.3.20-all.zip解压之后,从里面lib文件夹中找到struts2-json-plugin-2.3.20.jar。再放入一个JQuery。最后的网络目录结构如下所示:

三、制作过程

1、先从ajaxJson.java这个Action处理文件讲起,注意,除了text1这个字符串是双向,需要同时设置getter与setter之外。text2只进不出,只需要设置其setter。Struts2中setter的意思是设置此变量从前端接受数据。相反,text3只出不进,因此只设其getter。利用eclipse的Alt+Shift+S之后再R,生成的时候注意,别像往常一样,什么都有getter,setter。JSON中一般是一些从数据库查询出来的打包数据,setter与getter的设置是权限问题。

package test;//这是Struts2必要的支持import com.opensymphony.xwork2.ActionSupport;//加上这句,就不会在eclipse弹出序列号警告@SuppressWarnings("serial")//Struts2必须继承这个类public class ajaxJson extends ActionSupport {//这Action涉及到三个参数private String text1;private String text2;private String text3;//这是这个Action的执行方法public String run() throws Exception {text1="文本1的内容:"+text1;System.out.println(text2);text3="只出不进";return SUCCESS;}public String getText1() {return text1;}public void setText1(String text1) {this.text1 = text1;}public void setText2(String text2) {this.text2 = text2;}public String getText3() {return text3;}}可以看到,这个Action的执行方法非常简单,只需要赋予text1与text3的值即可,text2只是打印出来。一般配合JAVA与数据库的交互技术Hibernate,只需要把Hibernate的查询结果放进那些只出不进的值就可以。text2一般是查询必须的前台变量。这样就可以了。

在struts.xml中设置返回结果是JSON,struts2会帮你自动打包。根本就无须用到那些JSON包。这正是因为struts2-json-plugin-2.3.20.jar在起作用!2、struts.xml

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE struts PUBLIC"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"""><struts><!– 注意这里的extends不再是struts-default了,而是json-default –><package name="test" extends="json-default"><!– 指明ajaxJson这个Action的执行方法是test包中的ajaxJson.java中的run方法 –><action name="ajaxJson" class="test.ajaxJson" method="run"><!– 返回结果是json,,然后这两个参数,一般都这样写,不要问为什么! –><result type="json"><param name="noCache">true</param><param name="contentType">text/html</param></result></action></package></struts> 3、index.jsp

整个网页工程就这里一个页面,struts2返回过来的就是一个已经解析好的json,在形式参数中,已经设定好这个json的名字叫data,在javascript或者Jquery里面,直接利用data.text1就能够取出名为data的json中的text1的数字。

<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" ""><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>index</title><!– 首先,因为要使用JQuery的Ajax技术,所以要引入JQuery的JS文件 –><script src="jquery-1.11.1.js" type="text/javascript"></script></head><body><!– 两个很简单的输入框 –><input type="text" id="text1" /><br /><input type="text" id="text2" /><br /><button onclick="ajaxSubmit()">提交</button><p id="result"></p></body></html><script>/* 按钮一按就触发这个函数 */function ajaxSubmit() {/* 取出两个文本框的值 */var text1 = $("#text1").val();var text2 = $("#text2").val();$.ajax({/* 以post的方式传达 */type : "post",/* 送去ajaxJson的action */url : "ajaxJson",/* 请求返回的东西是json,填写text则返回json文本串 */dataType : "json",/* 送过去两个变量,后台请求的text1(左边),就赋予前台var text1的值(右边) *//* text2同理 */data : {text1 : text1,text2 : text2,},/* 如果后台有东西成功返回,那么就把结果显示在id为result的行内文本里面 */success : function(data) {$("#result").text(data.text1);},/* 除了断网我几乎没有见过Ajax传递数值失败的…… */error : function() {alert("出错了");}});}</script>

含泪播种的人一定能含笑收获。

plugin实现Struts2的Ajax功能并利用JSON传递数据

相关文章:

你感兴趣的文章:

标签云: