利用AJAX为JSP页面传递一个包含了若干对象的List集合

首先说明一下,我现在做的项目中前台用到的是jqm,利用的ajax向后台传递数值,返回的是json格式的数据。为了使大家一目了然,我把重要的代码张贴出来吧,并且个别地方有注释!

前台页面:

  1. <link rel="stylesheet"  
  2.             href="${pageContext.request.contextPath }/js/jquery.mobile-1.0.1.min.css">  
  3.         <script src="${pageContext.request.contextPath }/js/jquery-1.6.4.min.js"></script>  
  4.         <script type="text/javascript">  
  5.         $(function(){ //在页面加载后激活函数     
  6.              $("#history").bind("click", function() {  //为DOM对象中属性id="history"的元素绑定click事件,执行回调函数  
  7.                  $.ajax({  
  8.                      type:"post",//以post方式向后台提交数据  
  9.                      url:"${pageContext.request.contextPath}/lcecodelog/listL_cecodelog.action?uid=-6196080717979582463",//提交到后台的地址  
  10.                      data:{isAjax:true},//需要传递的数据 也可以这样写data:isAjax=true,username="Tom", 注意data是键值对应的数据  
  11.                      dataType:"json",//返回数据的格式是json  
  12.                      success:function(data){//后台代码执行成功后,执行的回调函数  
  13.                          console.log(data.list[0].exname);//在控制台上输出,可以测试一下是否返回正确数据.注意:这里的list是和后台中的放在data中的list一样的。  
  14.                          $.mobile.changePage("${pageContext.request.contextPath}/right/scancodehistory/listCodeHistory.jsp","slideleft"falsefalse);   
  15.                          //$.mobile.changePage()是jqm API的方法  
  16.                      }  
  17.                  });  
  18.                 });  
  19.             });   
  20.         </script>  
  21.         <script  
  22.             src="${pageContext.request.contextPath }/js/jquery.mobile-1.0.1.min.js"></script>  

后台Action类:
  1. //使用的是struts2,返回的是String类型的方法。  
  2. public String listL_cecodelog() {  
  3.     //注意:isAjax()和printJSONData()都是我写好的封装类,在这里就直接拿过来调用了。  
  4.       
  5.     Long uid = getParameterLong("uid");// 从url中获取参数uid   
  6.       
  7.     List<L_cecodelog> list = lcecodelogDAO.ListL_cecodelog(uid);   
  8.       
  9.     try {  
  10.         if(!isAjax()){//判断是不是ajax请求  
  11.             return null;  
  12.         }  
  13.         JSONObject data = new JSONObject();  
  14.         data.accumulate("list", list);//注意:这个list的名字和前台页面中list的名字需要一致。  
  15.         setSession("list", list);//之所以把list放在session会话中是因为需要在另一个页面循环list输出结果。  
  16.         printJSONData(data);  
  17.     } catch (ServletException e) {  
  18.         e.printStackTrace();  
  19.     } catch (IOException e) {  
  20.         e.printStackTrace();  
  21.     }   
  22.     return null;   
  23. }  

listCodeHistory.jsp中
  1. //在这里可以循环放在session中的list  
  2. <c:forEach items="${list }" var="code" varStatus="index">  
  3.                         <li>  
  4.                             <a  
  5.                                 href="${pageContext.request.contextPath}/lcecodelog/findT_exhibitByExid.action?exid=${code.exid}&id=${code.id}">${code.exid}  
  6.                                 ${code.exname}</a><span class="ui-li-count">${code.datetime}</span>  
  7.                         </li>  
  8.                     </c:forEach>  
  9.   
  10.   
  11.   
  12. </body>  
  13.     <%session.removeAttribute("list"); %>//为了信息安全,利用完session会话中的list之后,需要移除会话。  
  14. </html> 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值