jquery+ajax+struts实现异步刷新

最新推荐文章于 2018-02-26 17:30:54 发布

原创最新推荐文章于 2018-02-26 17:30:54 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍如何结合Struts框架与jQuery实现AJAX异步请求，包括配置struts.xml文件、设置JSON插件、编写jQuery AJAX调用及处理返回的JSON数据。

1. 由于异步刷新技术这么火，所以探究玩一下；

在 jquery 中有专门为 ajax 而设的方法和

首先就是导入 struts的jar包+json.js+jq.js+struts-plugin-json.jar

2. 页面初始化就开始加载异步的数据 $(function(){ ajax代码 })

1.JSON.stringify ========= object----jsonstring

<script type="text/javascript" src="lib/json2.js"></script>
	<script type="text/javascript">
		$(function(){
				
			$.ajax({
				 type: "GET",
                                 url: "useract_loadPremission.action",
	                        dataType: "json",
	                        success: function(data){
	            	        // alert(JSON.stringify(data));
	            	          var dt = data.tps;//所有的权限
	            	                   可以直接用 dt[i].id 遍历，因为 是 struts直接 转换成了 json对象
	                           },
	                         error:function(data){
	            	        alert(JSON.stringify(data)); // 
	                                             }
			});
		});
</script>

2. struts ----struts中就是必须要加 json-default

<package name="onlinedef" namespace="/"
		extends="struts-default,json-default">
		<action name="useract_*" method="{1}" class="userAction">
			<result name="toindex">/index.jsp</result>
			<result name="tomain">/WEB-INF/view/main.jsp</result>
			<result name="ajax" type="json">
				<param name="includeProperties">
<span style="white-space:pre">					</span>tps \ [\ d+\ ]\.preId,
<span style="white-space:pre">					</span>tps \ [\ d+ \]\.preName,
<span style="white-space:pre">					</span>tps \ [\ d+ \ ]\.preUrl,
<span style="white-space:pre">					</span>tps \ [ \ d+ \ ]\.preParentId,
<span style="white-space:pre">				</span></param>
			</result>
		</action>
	</package>

3. action中有很多的数据，必须防止 json把所有的数据都转化了

private user tps；---get方法

public String loadPremission() {

tps = userService.findPremissionByUser(CommonUtils.getSessionUser(
getRequest()).getUserId());
return "ajax"; ---- struts中声明是 type=json
} -------- json取出来 var ss= data.tps;

6.如果是提交表单的数据

$.ajax({

                cache: true,

                type: "POST",

                url:ajaxCallUrl,

                data:$('#yourformid').serialize(),// 你的formid

                async: false,

                error: function(request) {

                    alert("Connection error");

},

                success: function(data) {

                    $("#commonLayout_appcreshi").parent().html(data);

}

});