码迷，mamicode.com
首页 > Web开发 > 详细

Struts Work With AJAX ON JQUERY

时间：2014-08-13 00:40:44      阅读：440      评论：0      收藏：0      [点我收藏+]

标签：blog   http   java   使用   os   io   strong   文件   

原文地址：http://blog.csdn.net/zhqingyun163/article/details/5208766

 

项目中想用ajax，于是在网上扒了n多资料，犯了n多错误，从今天上班到现在一直在处理这个问题，终于还是把它解决了。

 

当我看到页面的ajax显示后，我兴奋异常，为了记录自己学习的ajax历程，也为了让更多的人少走弯路，特写此一文以记之！

 

废话不说了，为了更好的理解，我重做了一个小的项目，以加深印象。现在就以这个小项目开始我们的ajax之旅。

 

第一步：创建 名为"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的过滤器，代码如下：

 

[xhtml] view plaincopy
 
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <web-app version="2.5"   
  3.     xmlns="http://java.sun.com/xml/ns/javaee"   
  4.     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"   
  5.     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee   
  6.     http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">  
  7.       
  8.     <filter>  
  9.         <filter-name>struts2</filter-name>  
  10.         <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>  
  11.     </filter>  
  12.     <filter-mapping>  
  13.         <filter-name>struts2</filter-name>  
  14.         <url-pattern>/*</url-pattern>  
  15.     </filter-mapping>  
  16.       
  17.       
  18.       
  19.   <welcome-file-list>  
  20.     <welcome-file>index.jsp</welcome-file>  
  21.   </welcome-file-list>  
  22. </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，内容如下：

 

[java] view plaincopy
 
  1. package qy.test.action;  
  2.   
  3. import java.util.HashMap;  
  4. import java.util.Map;  
  5.   
  6. import net.sf.json.JSONObject;  
  7.   
  8. import com.opensymphony.xwork2.ActionSupport;  
  9.   
  10. public class AjaxLoginAction extends ActionSupport {  
  11.   
  12.     // 用户Ajax返回数据  
  13.     private String result;  
  14.   
  15.     // struts的属性驱动模式，自动填充页面的属性到这里  
  16.     private String loginName;  
  17.     private String password;  
  18.   
  19.     @Override  
  20.     public String execute() {  
  21.   
  22.         // 用一个Map做例子  
  23.         Map<String, String> map = new HashMap<String, String>();  
  24.   
  25.         // 为map添加一条数据，记录一下页面传过来loginName  
  26.         map.put("name", this.loginName);  
  27.   
  28.         // 将要返回的map对象进行json处理  
  29.         JSONObject jo = JSONObject.fromObject(map);  
  30.   
  31.         // 调用json对象的toString方法转换为字符串然后赋值给result  
  32.         this.result = jo.toString();  
  33.   
  34.         // 可以测试一下result  
  35.         System.out.println(this.result);  
  36.   
  37.         return SUCCESS;  
  38.   
  39.     }  
  40.   
  41.     //getter  setter 方法省略  
  42. }  

 

 

第六步：写前台index.jsp，注意加入 jquery的js文件 内容如下：

 

[javascript] view plaincopy
 
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"  
  2.     pageEncoding="UTF-8"%>  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  4. <html>  
  5.     <head>  
  6.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  7.         <mce:script type="text/javascript" src="js/jquery-1.3.2.min.js" mce_src="js/jquery-1.3.2.min.js"></mce:script>  
  8.         <mce:script type="text/javascript"><!--  
  9.     $(document).ready( function() {  
  10.           
  11.         //使用 Ajax 的方式 判断登录  
  12.         $("#btn_login").click( function() {  
  13.               
  14.             var url = ‘ajaxLogin.action‘;  
  15.               
  16.             alert("===");  
  17.               
  18.             //获取表单值，并以json的数据形式保存到params中  
  19.             var params = {  
  20.                 loginName:$("#loginName").val(),  
  21.                 password:$("#password").val(),  
  22.             }  
  23.             //使用$.post方式      
  24.             $.post(  
  25.               
  26.                 url,        //服务器要接受的url  
  27.                   
  28.                 params,     //传递的参数       
  29.                   
  30.                 function cbf(data){ //服务器返回后执行的函数 参数 data保存的就是服务器发送到客户端的数据  
  31.                   
  32.                     //alert(data);  
  33.                     var member = eval("("+data+")");    //包数据解析为json 格式    
  34.               
  35.                     $(‘#result‘).html("欢迎您：  "+member.name);  
  36.                       
  37.                 },   
  38.                   
  39.                 ‘json‘  //数据传递的类型  json  
  40.               
  41.             );  
  42.           
  43.         });  
  44.           
  45.     });  
  46. // --></mce:script>  
  47.     </head>  
  48.     <body>  
  49.         <span>用户名：</span>  
  50.         <input type="text" id="loginName" name="loginName">  
  51.         <br />  
  52.   
  53.         <span>密码：</span>  
  54.         <input type="password" name="password" id="password">  
  55.         <br />  
  56.   
  57.         <input type="button" id="btn_login" value="Login" />  
  58.         <p>  
  59.             这里显示ajax信息：  
  60.             <br />  
  61.             <span id="result"></span>  
  62.         </p>  
  63.     </body>  
  64. </html>  

 

 

第七步：在src目录下加入struts.xml，并配置相应的xml文件，为ajax请求提供数据。代码如下：

 

[xhtml] view plaincopy
 
  1. <?xml version="1.0" encoding="UTF-8" ?>  
  2. <!DOCTYPE struts PUBLIC  
  3.     "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"  
  4.     "http://struts.apache.org/dtds/struts-2.0.dtd">  
  5.   
  6. <struts>  
  7.   
  8.     <package name="ajax" extends="json-default">  
  9.         <action name="ajaxLogin" class="qy.test.action.AjaxLoginAction">  
  10.   
  11.             <!-- 返回类型为json 在sjon-default中定义 -->  
  12.             <result type="json">  
  13.   
  14.                 <!-- root的值对应要返回的值的属性 -->  
  15.                 <!-- 这里的result值即是 对应action中的 result -->  
  16.                 <param name="root">result</param>  
  17.             </result>  
  18.         </action>  
  19.     </package>  
  20.   
  21. </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中找。

Struts Work With AJAX ON JQUERY,布布扣,bubuko.com

Struts Work With AJAX ON JQUERY

标签：blog   http   java   使用   os   io   strong   文件   

原文地址：http://www.cnblogs.com/voctrals/p/3908676.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！