`
dreamoftch
  • 浏览: 495564 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

struts2+json/ajax

阅读更多
如果只需要返回一个字符串或其他文本信息,则:
 <result type="stream">
                                    <param name="contentType">text/html</param>
                                    <param name="inputName">inputStream</param>
</result>
在action里面:
public String login1() throws IOException{
		ByteArrayOutputStream bos = new ByteArrayOutputStream();
		bos.write("login".getBytes());
		inputStream = new ByteArrayInputStream(bos.toByteArray());
		return "success";
	}
并且加上inputstream的get/set方法即可,在页面直接ajax的result就是结果
 $.post("client!login1.action", { username: username, password: password },
    		   function(result){
    		     alert("Data : " + result);
    		   });




方法1:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"
        "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>


	<!-- 开发阶段设置 -->
	<constant name="struts.devMode" value="true" />
	<constant name="struts.serve.static.browserCache " value="false" />
	<constant name="struts.configuration.xml.reload" value="true" />
	<!-- 开发阶段设置 -->
	<!-- <package name="json-default" extends="struts-default"> <result-types> 
		<result-type name="json" class="org.apache.struts2.json.JSONResult" /> </result-types> 
		<interceptors> <interceptor name="json" class="org.apache.struts2.json.JSONInterceptor"/> 
		</interceptors> </package> -->

	<package name="/base" extends="struts-default" namespace="/base">
		<result-types>
			<result-type name="json" class="org.apache.struts2.json.JSONResult" />
		</result-types>
		
		<action name="Province" class="two.SupplyDetailAction" method="province">
			<result type="json">
				<!-- <param name="root">result</param> -->
			</result>
		</action>
		<action name="City" class="two.SupplyDetailAction" method="city">
		</action>
	</package>
	
	<package name="ns" extends="struts-default" namespace="/p">
		<action name="index">
			<result type="freemarker" name="input">/index.ftl</result>
		</action>
	</package>
</struts>
 
<html>
<head>

<script type="text/javascript" src="${base}/jquery.js"> </script> 

<script >
$(document).ready(function(){
   
	    var province=$("#province");   
	    var city=$("#city");   
	    var provinceurl="${base}/base/Province.action";   
	    $.post(provinceurl,{code:"province"},function(dataObj){   <#-- 因为在struts.xml中type="json" 
	    																	所以后台action中的属性 会变为json类型的dataObj如{name:tch,age:22......}
	    																	所以在页面端通过对dataObj进行操作,如dataObj.name   dataObj.age
	    																	dataObj.provinces拿到的是一个后台的List,在前天则是一个对象数组,所以
	    																	通过遍历即可$.each(dataObj.provinces,function(index,value){})-->
	     
	        $.each(dataObj.provinces,function(index,item){   
	        var tempOption = document.createElement("option");   
	        tempOption.value = item.provinceId;   
	        tempOption.innerHTML  = item.provinceName;  
	        province.append(tempOption);   
	        });   
	    },"json");   
	     
	    province.change(function(){  
	    if($("#province option:selected").val() ==""){
	    	return;
	    } 
	      city.empty();
	      city.append("<option value='-1'>请选择省份</option>");    
	      var params={provinceCode:$("#province option:selected").val()};   
	      $.post("${base}/base/City.action",params,function(dataObj){   
	        $.each(dataObj.cities,function(index,item){   
	        var tempOption = document.createElement("option");   
	        tempOption.value = item.cityId;   
	        tempOption.innerHTML  = item.cityName;   
	        city.append(tempOption);   
	        });   
	      },"json");    
	    });   
	    

});

</script>
</head>
<body>
<form action="${base}/act.action" id="productForm"
			name="productForm" method="post">
<input type="text" onclick="ff();">
 <div>  
        
          省份:<select name="province" id="province">  
               <option value="">请选择省份</option>  
            </select>  
          城市:<select name="city" id="city">  
            <option>请选择城市</option>  
            </select>  
    </div>  

</form>
</body>
</html>
 

通过访问http://localhost:8080/WebTest/p/index.action访问index.ftl页面,页面加载完之后,已经完成了对省份的ajax请求,再改变省份的选择,就对城市也进行了ajax请求

 

但是这里仅仅实现了ajax请求json数据,其余的功能以及存在的问题还需自己修正和完善.

 

 

 

情况2:

 

如果:

<result type="json">
	<param name="root">result</param> 
</result>
 

即加入了

<param name="root">result</param> 

那么就要作出相应的修改,因为这句话的意思是说将ajax请求返回的数据存储在了result变量里面,所以,要在action里面加入string类型的result,添加get/set方法,并且在execute或其他相应的方法里面return success之前要对result赋值、初始化。

public String province() {
		Province p = new Province();
		p.setProvinceId("1");
		p.setProvinceName("河南");
		provinces.add(p);
		Province p2 = new Province();
		p2.setProvinceId("2");
		p2.setProvinceName("河南2");
		provinces.add(p2);

                //下面这两句话就是对result的初始化,即将要返回给页面的数据放在result中。。
		JSONArray jsonArray2 = JSONArray.fromObject(provinces);
		this.result = jsonArray2.toString();
		return SUCCESS;
	}

 然后在页面里面

 

$.post(provinceurl,{code:"province"},function(msg){   
                //相应的在页面上,对于返回的数据要先进行处理,通过eval()将数据转化为json类型
		dataObj = eval("("+msg+")");
	        $.each(dataObj,function(index,item){   
	        var tempOption = document.createElement("option");   
	        tempOption.value = item.provinceId;   
	        tempOption.innerHTML  = item.provinceName;  
	        province.append(tempOption);   
	        });   
	    },"json");   

 即可。

 

但是不建议使用方法2,因为这样多做了一些无用功

 

分享到:
评论

相关推荐

    struts2+json+ajax整合例子(导入即可运行,附带详细教程)

    Struts2、JSON和AJAX是Web开发中的关键技术,它们的整合可以实现高效的数据交互和动态页面更新。本文将深入探讨这些技术以及如何在实际项目中整合它们。 **Struts2** 是一个基于MVC(Model-View-Controller)设计...

    struts2+json

    这个资源"struts2+json"显然涉及到在Struts2框架下实现JSON(JavaScript Object Notation)数据交换,这是一种轻量级的数据交换格式,广泛用于前后端交互,特别是AJAX(Asynchronous JavaScript and XML)请求。...

    ExtJS4+Accordion+SERVLET/STRUTS2+JSON+Ext.tree.Panel实例

    这个实例结合了多个技术,包括Accordion布局、Servlet、Struts2以及JSON数据交互,以及Ext.tree.Panel组件,以创建一个功能丰富的用户界面。 Accordion布局是ExtJS中的一个布局管理器,它允许在一个区域内组织多个...

    struts2+json+ajax+jquery

    Struts2、JSON、Ajax 和 jQuery 是Web开发中的四个关键技术,它们共同构建了现代Web应用程序的数据交互和用户界面交互的核心部分。 Struts2 是一个基于MVC(Model-View-Controller)架构的Java Web框架,它使得...

    Struts2 + jQuery+JSON 实现ajax

    ### Struts2 + jQuery + JSON 实现Ajax 在现代Web开发中,Ajax技术因其能够实现网页的局部刷新而被广泛采用。本篇文章介绍如何利用Struts2框架结合jQuery与JSON来构建一个简单的Ajax功能。 #### 一、环境搭建 1. ...

    struts2+jquery+json+ajax例子

    Struts2、jQuery、JSON和Ajax是Web开发中常见的技术栈,它们共同为构建动态、交互式的用户界面提供了强大的支持。下面将详细解释这些技术及其在登录示例中的应用。 Struts2是一个基于MVC(Model-View-Controller)...

    struts2+json+ajax

    Struts2、JSON和Ajax是Web开发中的三个关键技术,它们共同构建了动态、交互式的用户界面,提高了用户体验。本文将详细解析这三个技术及其在实际应用中的整合。 **Struts2** 是一个开源的MVC(Model-View-Controller...

    struts2+json+jquery实现ajax数据的存取

    "Struts2+JSON+jQuery实现Ajax数据的存取"就是一个典型的示例,它结合了强大的MVC框架Struts2、轻量级的数据交换格式JSON以及高效的前端库jQuery,以实现网页上的无刷新数据交互。下面将详细介绍这三个技术及其在...

    Struts2+JSON 实现AJAX 返回对象和列表

    ### Struts2+JSON 实现 AJAX 返回对象和列表 #### 一、背景介绍 随着Web技术的发展,Ajax(Asynchronous JavaScript and XML)已经成为现代Web应用不可或缺的一部分。它通过后台与前端进行异步数据交换和操作,使...

    最新Struts2+jq+ajax+json 学会总要4步‵‵超级简单,里面包含实例

    学会struts+jq+ajax+json只要4步‵‵经过作者的总结超级简单 1. 导入struts2 及json包 asm-3.3.jar asm-commons-3.3.jar asm-tree-3.3.jar commons-fileupload-1.2.2.jar commons-io-2.0.1.jar commons-lang3-3.1....

    ExtJs + Struts2 + JSON 程序总结

    在前端,EXTJS使用Ajax请求调用Struts2 Action,接收返回的JSON数据,然后动态渲染UI,展示所有订单及其对应的客户信息。 总结来说,ExtJs + Struts2 + JSON 的组合提供了一种高效、灵活的方法来构建富客户端Web...

    struts2+jQuery+json实现AJAX.zip

    struts2+jQuery+json实现AJAX.zip

    ZTree+Struts2+ajax+json实现checkbox权限树

    【标题】"ZTree+Struts2+ajax+json实现checkbox权限树"涉及的技术栈主要集中在前端的ZTree,后端的Struts2框架,以及数据交互中的Ajax和JSON。这个项目的核心目标是构建一个可复选的权限树形结构,用户通过勾选节点...

    Struts2+JSON+JQuery实现简单的验证

    Struts2、JSON和JQuery是Web开发中的三个关键技术,它们常常被结合使用来构建高效、动态的用户界面。在本教程中,我们将探讨如何利用这些技术实现一个简单的验证功能。 首先,Struts2是一个基于MVC(Model-View-...

    Struts2+JSON+AJAX+DW

    Struts2与AJAX结合的学习,包括JSON数据,还包括AJAX的dw框架的学习,包括实际易懂的例子。

    一个简单的struts2+json+jquery 交互的例子

    当用户界面触发某个事件(比如点击按钮),jQuery会发起Ajax请求,Struts2 Action执行相关逻辑并生成JSON响应,最后jQuery将数据插入到网页中,完成一次完整的交互。 总结来说,这个例子展示了如何利用Struts2处理...

Global site tag (gtag.js) - Google Analytics