- 浏览: 15476 次
- 性别:
- 来自: 上海
文章分类
最新评论
struts2 jquery json进行ajax请求
2010-05-25 15:31
第一步:创建 名为"ajax" 的 Java Web项目。
第二步:加入struts2的jar包,这里需要四个包 freemarker.jar ognl.jar struts2-core.jar commons-fileupload.jar commons-io.jar xwork-core-2.1.6.jar(这个包加上版本号,是因为下文要提到它),这六个包是struts必须依赖的jar包,什么好说的。
第三步:修改 web.xml 加入 struts的过滤器,代码如下:
view plaincopy to clipboardprint?
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
第四步:加入json的包,这里需要两个:json-lib.jar jsonplugin.jar 这里要注意很重要的一点,因为json大量引用了Apache commons的包,所以这里要一并加入,需要的commons包共4个,除了commons的包外,还需要引入一个 ezmorph的包,所以这一步一共要引入7个包,列出如下:commons-collections.jar commons-lang.jar commons-beanutils.jar commons-logging.jar ezmorph.jar 再加上json的两个包共七个,一次性加入。
第五步:写后台处理AjaxLoginAction.action,内容如下:
view plaincopy to clipboardprint?
package qy.test.action;
import java.util.HashMap;
import java.util.Map;
import net.sf.json.JSONObject;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxLoginAction extends ActionSupport {
// 用户Ajax返回数据
private String result;
// struts的属性驱动模式,自动填充页面的属性到这里
private String loginName;
private String password;
@Override
public String execute() {
// 用一个Map做例子
Map<String, String> map = new HashMap<String, String>();
// 为map添加一条数据,记录一下页面传过来loginName
map.put("name", this.loginName);
// 将要返回的map对象进行json处理
JSONObject jo = JSONObject.fromObject(map);
// 调用json对象的toString方法转换为字符串然后赋值给result
this.result = jo.toString();
// 可以测试一下result
System.out.println(this.result);
return SUCCESS;
}
//getter setter 方法省略
}
package qy.test.action;
import java.util.HashMap;
import java.util.Map;
import net.sf.json.JSONObject;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxLoginAction extends ActionSupport {
// 用户Ajax返回数据
private String result;
// struts的属性驱动模式,自动填充页面的属性到这里
private String loginName;
private String password;
@Override
public String execute() {
// 用一个Map做例子
Map<String, String> map = new HashMap<String, String>();
// 为map添加一条数据,记录一下页面传过来loginName
map.put("name", this.loginName);
// 将要返回的map对象进行json处理
JSONObject jo = JSONObject.fromObject(map);
// 调用json对象的toString方法转换为字符串然后赋值给result
this.result = jo.toString();
// 可以测试一下result
System.out.println(this.result);
return SUCCESS;
}
//getter setter 方法省略
}
第六步:写前台index.jsp,注意加入 jquery的js文件 内容如下:
view plaincopy to clipboardprint?
<%@ 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">
<mce:script type="text/javascript" src="js/jquery-1.3.2.min.js" mce_src="js/jquery-1.3.2.min.js"></mce:script>
<mce:script type="text/javascript"><!--
$(document).ready( function() {
//使用 Ajax 的方式 判断登录
$("#btn_login").click( function() {
var url = 'ajaxLogin.action';
alert("===");
//获取表单值,并以json的数据形式保存到params中
var params = {
loginName:$("#loginName").val(),
password:$("#password").val(),
}
//使用$.post方式
$.post(
url, //服务器要接受的url
params, //传递的参数
function cbf(data){ //服务器返回后执行的函数 参数 data保存的就是服务器发送到客户端的数据
//alert(data);
var member = eval("("+data+")"); //包数据解析为json 格式
$('#result').html("欢迎您: "+member.name);
},
'json' //数据传递的类型 json
);
});
});
// --></mce:script>
</head>
<body>
<span>用户名:</span>
<input type="text" id="loginName" name="loginName">
<br />
<span>密码:</span>
<input type="password" name="password" id="password">
<br />
<input type="button" id="btn_login" value="Login" />
<p>
这里显示ajax信息:
<br />
<span id="result"></span>
</p>
</body>
</html>
<%@ 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">
<mce:script type="text/javascript" src="js/jquery-1.3.2.min.js" mce_src="js/jquery-1.3.2.min.js"></mce:script>
<mce:script type="text/javascript"><!--
$(document).ready( function() {
//使用 Ajax 的方式 判断登录
$("#btn_login").click( function() {
var url = 'ajaxLogin.action';
alert("===");
//获取表单值,并以json的数据形式保存到params中
var params = {
loginName:$("#loginName").val(),
password:$("#password").val(),
}
//使用$.post方式
$.post(
url, //服务器要接受的url
params, //传递的参数
function cbf(data){ //服务器返回后执行的函数 参数 data保存的就是服务器发送到客户端的数据
//alert(data);
var member = eval("("+data+")"); //包数据解析为json 格式
$('#result').html("欢迎您: "+member.name);
},
'json' //数据传递的类型 json
);
});
});
// --></mce:script>
</head>
<body>
<span>用户名:</span>
<input type="text" id="loginName" name="loginName">
<br />
<span>密码:</span>
<input type="password" name="password" id="password">
<br />
<input type="button" id="btn_login" value="Login" />
<p>
这里显示ajax信息:
<br />
<span id="result"></span>
</p>
</body>
</html>
第七步:在src目录下加入struts.xml,并配置相应的xml文件,为ajax请求提供数据。代码如下:
view plaincopy to clipboardprint?
<?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>
<package name="ajax" extends="json-default">
<action name="ajaxLogin" class="qy.test.action.AjaxLoginAction">
<!-- 返回类型为json 在sjon-default中定义 -->
<result type="json">
<!-- root的值对应要返回的值的属性 -->
<!-- 这里的result值即是 对应action中的 result -->
<param name="root">result</param>
</result>
</action>
</package>
</struts>
<?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>
<package name="ajax" extends="json-default">
<action name="ajaxLogin" class="qy.test.action.AjaxLoginAction">
<!-- 返回类型为json 在sjon-default中定义 -->
<result type="json">
<!-- root的值对应要返回的值的属性 -->
<!-- 这里的result值即是 对应action中的 result -->
<param name="root">result</param>
</result>
</action>
</package>
</struts>
第八步:如果第四步没有加入commons-logging.jar包,这里要记得加入
第九步:发布运行。很不幸,你会发现一个错误,
java.lang.ClassNotFoundException: com.opensymphony.xwork2.util.TextUtils:
这是struts的版本错误,因为用的xwork2.1.6-core.jar中不存在TextUtils类,这里把 xwork2.1.2-core.jar也加到classpath中,xwork2.1.2-core.jar中包含这个东西,我们用的是xwork2.1.6的jar,当要用到TextUtils时,就去xwork2.1.2-core.jar中找。
2010-05-25 15:31
第一步:创建 名为"ajax" 的 Java Web项目。
第二步:加入struts2的jar包,这里需要四个包 freemarker.jar ognl.jar struts2-core.jar commons-fileupload.jar commons-io.jar xwork-core-2.1.6.jar(这个包加上版本号,是因为下文要提到它),这六个包是struts必须依赖的jar包,什么好说的。
第三步:修改 web.xml 加入 struts的过滤器,代码如下:
view plaincopy to clipboardprint?
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
第四步:加入json的包,这里需要两个:json-lib.jar jsonplugin.jar 这里要注意很重要的一点,因为json大量引用了Apache commons的包,所以这里要一并加入,需要的commons包共4个,除了commons的包外,还需要引入一个 ezmorph的包,所以这一步一共要引入7个包,列出如下:commons-collections.jar commons-lang.jar commons-beanutils.jar commons-logging.jar ezmorph.jar 再加上json的两个包共七个,一次性加入。
第五步:写后台处理AjaxLoginAction.action,内容如下:
view plaincopy to clipboardprint?
package qy.test.action;
import java.util.HashMap;
import java.util.Map;
import net.sf.json.JSONObject;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxLoginAction extends ActionSupport {
// 用户Ajax返回数据
private String result;
// struts的属性驱动模式,自动填充页面的属性到这里
private String loginName;
private String password;
@Override
public String execute() {
// 用一个Map做例子
Map<String, String> map = new HashMap<String, String>();
// 为map添加一条数据,记录一下页面传过来loginName
map.put("name", this.loginName);
// 将要返回的map对象进行json处理
JSONObject jo = JSONObject.fromObject(map);
// 调用json对象的toString方法转换为字符串然后赋值给result
this.result = jo.toString();
// 可以测试一下result
System.out.println(this.result);
return SUCCESS;
}
//getter setter 方法省略
}
package qy.test.action;
import java.util.HashMap;
import java.util.Map;
import net.sf.json.JSONObject;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxLoginAction extends ActionSupport {
// 用户Ajax返回数据
private String result;
// struts的属性驱动模式,自动填充页面的属性到这里
private String loginName;
private String password;
@Override
public String execute() {
// 用一个Map做例子
Map<String, String> map = new HashMap<String, String>();
// 为map添加一条数据,记录一下页面传过来loginName
map.put("name", this.loginName);
// 将要返回的map对象进行json处理
JSONObject jo = JSONObject.fromObject(map);
// 调用json对象的toString方法转换为字符串然后赋值给result
this.result = jo.toString();
// 可以测试一下result
System.out.println(this.result);
return SUCCESS;
}
//getter setter 方法省略
}
第六步:写前台index.jsp,注意加入 jquery的js文件 内容如下:
view plaincopy to clipboardprint?
<%@ 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">
<mce:script type="text/javascript" src="js/jquery-1.3.2.min.js" mce_src="js/jquery-1.3.2.min.js"></mce:script>
<mce:script type="text/javascript"><!--
$(document).ready( function() {
//使用 Ajax 的方式 判断登录
$("#btn_login").click( function() {
var url = 'ajaxLogin.action';
alert("===");
//获取表单值,并以json的数据形式保存到params中
var params = {
loginName:$("#loginName").val(),
password:$("#password").val(),
}
//使用$.post方式
$.post(
url, //服务器要接受的url
params, //传递的参数
function cbf(data){ //服务器返回后执行的函数 参数 data保存的就是服务器发送到客户端的数据
//alert(data);
var member = eval("("+data+")"); //包数据解析为json 格式
$('#result').html("欢迎您: "+member.name);
},
'json' //数据传递的类型 json
);
});
});
// --></mce:script>
</head>
<body>
<span>用户名:</span>
<input type="text" id="loginName" name="loginName">
<br />
<span>密码:</span>
<input type="password" name="password" id="password">
<br />
<input type="button" id="btn_login" value="Login" />
<p>
这里显示ajax信息:
<br />
<span id="result"></span>
</p>
</body>
</html>
<%@ 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">
<mce:script type="text/javascript" src="js/jquery-1.3.2.min.js" mce_src="js/jquery-1.3.2.min.js"></mce:script>
<mce:script type="text/javascript"><!--
$(document).ready( function() {
//使用 Ajax 的方式 判断登录
$("#btn_login").click( function() {
var url = 'ajaxLogin.action';
alert("===");
//获取表单值,并以json的数据形式保存到params中
var params = {
loginName:$("#loginName").val(),
password:$("#password").val(),
}
//使用$.post方式
$.post(
url, //服务器要接受的url
params, //传递的参数
function cbf(data){ //服务器返回后执行的函数 参数 data保存的就是服务器发送到客户端的数据
//alert(data);
var member = eval("("+data+")"); //包数据解析为json 格式
$('#result').html("欢迎您: "+member.name);
},
'json' //数据传递的类型 json
);
});
});
// --></mce:script>
</head>
<body>
<span>用户名:</span>
<input type="text" id="loginName" name="loginName">
<br />
<span>密码:</span>
<input type="password" name="password" id="password">
<br />
<input type="button" id="btn_login" value="Login" />
<p>
这里显示ajax信息:
<br />
<span id="result"></span>
</p>
</body>
</html>
第七步:在src目录下加入struts.xml,并配置相应的xml文件,为ajax请求提供数据。代码如下:
view plaincopy to clipboardprint?
<?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>
<package name="ajax" extends="json-default">
<action name="ajaxLogin" class="qy.test.action.AjaxLoginAction">
<!-- 返回类型为json 在sjon-default中定义 -->
<result type="json">
<!-- root的值对应要返回的值的属性 -->
<!-- 这里的result值即是 对应action中的 result -->
<param name="root">result</param>
</result>
</action>
</package>
</struts>
<?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>
<package name="ajax" extends="json-default">
<action name="ajaxLogin" class="qy.test.action.AjaxLoginAction">
<!-- 返回类型为json 在sjon-default中定义 -->
<result type="json">
<!-- root的值对应要返回的值的属性 -->
<!-- 这里的result值即是 对应action中的 result -->
<param name="root">result</param>
</result>
</action>
</package>
</struts>
第八步:如果第四步没有加入commons-logging.jar包,这里要记得加入
第九步:发布运行。很不幸,你会发现一个错误,
java.lang.ClassNotFoundException: com.opensymphony.xwork2.util.TextUtils:
这是struts的版本错误,因为用的xwork2.1.6-core.jar中不存在TextUtils类,这里把 xwork2.1.2-core.jar也加到classpath中,xwork2.1.2-core.jar中包含这个东西,我们用的是xwork2.1.6的jar,当要用到TextUtils时,就去xwork2.1.2-core.jar中找。
发表评论
文章已被作者锁定,不允许评论。
-
struts2 jquery json ajax 三级联动菜单(2009-05-27 10:40:10)转载标签:it
2010-06-27 09:57 1902struts2 jquery json ajax 三级联动菜单 ... -
整合struts2 jQuery validate 插件的远程Ajax验证
2010-06-06 17:37 2069整合struts2 jQuery validate 插件的远程 ... -
struts2,jquery,ajax实现无刷新登录
2010-06-06 17:32 1136struts2,jquery,ajax实现无刷新登录2010- ... -
Struts2 + JQuery + JSON实现AJAX(2)
2010-06-06 17:29 1003Struts2 + JQuery + JSON实现AJAX20 ... -
struts2 json jquery 集成详解(3)
2010-06-06 17:23 678直接访问http://manager.17k ... -
struts2 json jquery 集成详解(1)
2010-06-06 17:12 977从以下网址http://code.google.com/p/j ... -
struts2 json jquery 集成详解(2)
2010-06-06 17:11 16014页面操作。Jquery中已经提供几供ajax请求的方法,如果 ...
相关推荐
标题 "Jquery struts2 json 实现ajax" 涉及到的是在Web开发中使用jQuery库与Struts2框架结合处理JSON数据的Ajax技术。这个主题主要关注如何通过前端的jQuery实现异步请求,与后端的Struts2框架进行交互,从而更新...
Struts2、JSON、Ajax 和 jQuery 是Web开发中的四个关键技术,它们共同构建了现代Web应用程序的数据交互和用户界面交互的核心部分。 Struts2 是一个基于MVC(Model-View-Controller)架构的Java Web框架,它使得...
struts2下通过jquery的ajax从后台传json对象并展示在web页面上的一个小例子,所需的jar包请自己下载否则无法运行,所需的包包括struts的必须包,json的支持包和struts对json的支持包
在Struts2JQueryJson中,jQuery主要负责发起Ajax请求,处理服务器返回的数据,并更新页面元素。 **JSON** JSON是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。它是基于JavaScript语法的...
1. **配置Struts2**:首先,需要在Struts2的配置文件`struts.xml`中定义Action,设置返回类型为"json",这样Struts2就会自动将Action的返回值转化为JSON格式。 ```xml <action name="ajaxAction" class=...
Struts2、jQuery、JSON和Ajax是Web开发中的关键技术,它们在构建动态、交互式的用户界面方面发挥着重要作用。在“三级联动菜单”的场景中,这些技术被巧妙地结合在一起,实现了多级选择的联动效果。 首先,Struts2...
在Struts2框架下,我们可以使用Jquery的Ajax方法向服务器发送请求,获取JSON或XML数据,然后动态更新页面的部分内容。 在"06-mvc之struts2.ppt"中,可能涵盖了以下内容: 1. Struts2框架的基本概念和架构 2. 如何...
### Struts2 + jQuery + JSON 实现Ajax 在现代Web开发中,Ajax技术因其能够实现网页的局部刷新而被广泛采用。本篇文章介绍如何利用Struts2框架结合jQuery与JSON来构建一个简单的Ajax功能。 #### 一、环境搭建 1. ...
这告诉Struts2框架当收到名为`struts2Action`的请求时,使用`Struts2Action`类,并返回JSON格式的结果。如果需要在Action执行后返回一个页面,可以将`result`元素的类型改为`dispatcher`。 总结来说,通过这种方式...
- **前端请求**:jQuery的$.ajax()方法被调用,指定URL为Struts2的Action,设置type为'POST'或'GET',dataType为'json',数据以JSON格式通过data参数传递。 - **Struts2处理**:Struts2框架接收到请求后,根据配置...
Struts2、jQuery、JSON和Ajax是Web开发中常见的技术栈,它们共同为构建动态、交互式的用户界面提供了强大的支持。下面将详细解释这些技术及其在登录示例中的应用。 Struts2是一个基于MVC(Model-View-Controller)...
本示例将探讨如何利用jQuery的Ajax功能向Struts2框架发送请求,并以JSON格式接收响应数据。下面我们将详细讨论这些技术以及它们在实际应用中的交互过程。 首先,jQuery是一个轻量级的JavaScript库,它简化了DOM操作...
在后端,我们需要创建一个Struts2 Action类,用于处理Ajax请求并返回JSON数据。例如,创建一个名为`AjaxAction.java`的类: ```java import com.opensymphony.xwork2.ActionSupport; import org.apache.struts2....
这个"Struts2 JQueryJson例子 .rar"压缩包很可能是包含了一个实际的项目实例,演示了如何在Struts2框架中利用JQuery和JSON进行数据交互。下面将详细讲解Struts2、JQuery和JSON的相关知识点: 1. **Struts2框架**: ...
总结,Struts2和jQuery的Ajax JSON数据交换涉及以下几个关键步骤:配置Struts2的JSON插件,编写返回JSON数据的Action,使用jQuery发起Ajax请求并处理返回的JSON数据。通过这种方式,可以实现客户端与服务器之间的...
这个资源"struts2+json"显然涉及到在Struts2框架下实现JSON(JavaScript Object Notation)数据交换,这是一种轻量级的数据交换格式,广泛用于前后端交互,特别是AJAX(Asynchronous JavaScript and XML)请求。...
2. **JSON与Struts2的结合**:Struts2 Action执行后返回一个JSON字符串,这个字符串被jQuery AJAX请求接收。通过Struts2的插件,如struts2-json-plugin,可以在Action类中直接返回一个包含JSON数据的对象,Struts2会...
测试文件可能包括JUnit测试用例,用于验证Struts2和JSON集成的功能是否正常工作,以及Ajax请求是否能正确地与服务器进行通信并接收预期的JSON响应。 通过这种整合,开发者可以利用Struts2的强大功能处理后端业务...
在“jsa03”这个文件中,可能包含了相关的JavaScript代码,这些代码负责与Struts2 Action进行Ajax通信,使用jQuery发送请求并处理返回的JSON数据。例如,可能有一个函数用于向服务器发送请求,获取数据,然后使用$....