jsp中div遍历list集合

—————三省农场 专栏收录该内容
5 篇文章 1 订阅

        今天拿到一个新的需求实现,页面右边有两个tab,其中一个为今日报警,点击该tab连接一个页面,页面显示今日报警的最新两条记录。


    之前的查询都是分页返回ListData,然后查询数据显示在表格,然后在xml中配置URL,即action中该查询方法所打的标签。


        我还天真的以为jsp中也可以承接一个action返回的URL,不过一直显示不出来数据,后来发现自己思维很不灵活,各方法的使用也不熟练,比如这个明明不需要分页的,而且service层封装的finder查询器可以增加最大查询结果数(所以多看下更深处的东西,越到最底层越能体会柳暗花明又一村的感觉)

         开始也网上查找jsp中div如何遍历action返回的数据,可大多都是json返回给tb,然后自己就一直陷进去了,因为我返回的是分页json,而且页面接收也不是tb,而是div,这下<c:forEach>否定了,后来大神指点后,肠子都悔青了,有了一个想法一定要去实践,去证明它。哎,看下它的真面目吧。

一、service中查询今日最新2条记录:

	/**
	 * 获取红外监控当前列表
	 * @param pageSize
	 * @param request
	 * @return
	 */
	@SuppressWarnings("unchecked")
	public List<SnAlarmRecord> listtoday(int pageSize,HttpServletRequest request){
	    //创造带hql的创造器
		Finder finder = Finder.create("select new com.snsoft.ssnc.ncgl.entity.SnAlarmRecord(recorduuid,eqname,alarmlocation,alarmstate,alarmtime)");
		//查询日期为当天              
		finder.append("from SnAlarmRecord where DateDiff(dd,alarmtime,getdate())=0 ");
		//根据日期排序,且是降序
		finder.append(" order by alarmtime desc");
		//查询最新的2条
		finder.setMaxResults(pageSize);
		
		return super.listByFinder(finder);	
	}

二、action中方法的调用(将查询list放在map中,并返回需要承接的jsp页面)

	/**
	 * 获取红外监控当天数据页面
	 * @param sortorder 排序方式
	 * @param request
	 * @return
	 */
	@RequestMapping(value="/hwjk_right.do", method=RequestMethod.GET)
	public String hwjk_right(ModelMap modelMap, String leftData,HttpServletRequest request){
		//返回查询的今日2条list集合
		List<SnAlarmRecord> list = alarmrecordService.listtoday(2, request);
		//将list放在map中
		modelMap.put("list", list);
		
		return "ssnc/common/hwjk_right";
	}

三、jsp中遍历放在map中的list

<span style="font-weight: normal;"><%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/framework/include/taglib.jsp" %>

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>红外监控</title>
<style type="text/css">
.topd{height:60px;position:relative; border:1px solid #ccc; margin:2px;}
.topd img{position:absolute; top:10px; left:10px;}
.topd .nmsg{position:absolute; top:25px; left:50px;}
.topd .nmsg b{color:red;}

.msglist{position:relative;border:1px solid #ccc; margin:2px;font-size:12px;}
.msglist .msgitm{padding:5px;border-bottom:1px solid #ccc; line-height:18px;}
.msglist .msgitm b{color:red;}
</style>
</head>
<body style="margin:0;padding:0;">

<div class="topd">
<img src="${path }/resource/framework/img/alarm.png" />
<div class="nmsg">今日报警 <b>2</b> 条</div>
</div>
<div >
	<c:forEach items="${list }" var="s">
	<div class="msglist">时间:<fmt:formatDate value="${s.alarmtime }" pattern="yyyy-MM-dd HH:mm:ss" /><br/>
		设备:${s.eqname }<br/>
		位置:${s.alarmlocation }<br/>
		状态:<b>${s.alarmstate==0 ? "未处理":"已处理" }</b>
	</div>
	</c:forEach>	
	
</div>
</body>
</html></span>

四、最后首页的xml连接到该jsp即可



     有想法了一定要实践来证明,不要故步自封。

  • 0
    点赞
  • 7
    评论
  • 4
    收藏
  • 打赏
    打赏
  • 扫一扫,分享海报

评论7
请先登录 后发表评论~
©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页

打赏作者

u010097777

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值