<c:forEach> 并列遍历同一个集合(并列排版)
具体效果是这样哒
具体实现时这样哒(标红处为关键部分)
<%@ page language="java" pageEncoding="UTF-8"%> <%@page import="com.hfepc.domain.biz.ProductionOrderSchedule"%> <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%> <%@taglib uri="hfepcTag" prefix="hf"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML> <html> <head> <base href="<%=basePath%>"> <title>小时产能录入</title> <link rel="stylesheet" type="text/css" href="resources/widget/jQuery Validation Plugin/jquery.validate.css"> <link rel="stylesheet" type="text/css" href="resources/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="resources/css/default.css"> <link rel="stylesheet" type="text/css" href="resources/css/webapp.css"> <script type="text/javascript" src="resources/js/vue.js"></script> <script type="text/javascript" src="resources/js/jquery.min.js"></script> <!-- element-ui --> <link rel="stylesheet" href="resources/widget/element-ui/theme-default/index.css"> <script src="resources/widget/element-ui/index.js"></script> <style type="text/css"> .h4, .h5, .h6, h4, h5, h6 {margin-top: 0;margin-bottom: 0;} th, td{font-size: 16px;} label,P{font-size: 18px;} </style> </head> <body onload="autoRowSpan(tb,0,0)"> <nav class="navbar navbar-fixed-top navbar-inverse"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand"><span>小时产能录入</span></a> </div> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav navbar-right"> <li class="danger"> <a href="webapp/index" title="主页"><i class="glyphicon glyphicon-home"></i> 主页</a> </li> </ul> </div> </div> </nav><!-- ./nav --> <div class="container-fluid"> <form id="fm" class="form-horizontal"> <div class="wrapper"> <div class="row"> <div class="form-group"> <div class="col-sm-2 text-right"><label class="control-label">生产线:</label></div> <div class="col-sm-4"><p class="form-control-static">${productLine.name }</p></div> <div class="col-sm-2 text-right"><label class="control-label">工作日期:</label></div> <div class="col-sm-4"><p class="form-control-static"><fmt:formatDate value="${now }" pattern="yyyy-MM-dd"/></p></div> </div> <table class="table table-striped table-bordered table-hover table-condensed text-center" id="tb"> <thead> <tr> <th class=" text-center">班别</th> <th class=" text-center">时间段</th> <th class=" text-center">A/B边</th> <th class=" text-center">目标产量</th> <th class=" text-center">实际产量</th> <th class=" text-center">班别</th> <th class=" text-center">时间段</th> <th class=" text-center">A/B边</th> <th class=" text-center">目标产量</th> <th class=" text-center">实际产量</th> </tr> </thead> <tbody id="tblDetail"> <tr> <c:forEach items="${row }" var="lineSectionDailyInfo" varStatus="status"> <c:if test="${status.count%2!=0}"> <%-- <c:if test="${lineSectionDailyInfo.timePeriod.shift == 1}"> --%> <td style="vertical-align: middle !important;text-align: center;"><hf:dictionary type="text" cssClass="form-control input-sm" name="shift" group="SCHEDULING_SHIFT" value="${lineSectionDailyInfo.timePeriod.shift }" /></td> <td>${lineSectionDailyInfo.timePeriod.alias }</td> <td>${lineSectionDailyInfo.sectionId }边</td> <td>${lineSectionDailyInfo.planCplQty }</td> <td> <c:choose> <c:when test="${empty lineSectionDailyInfo.actCplQty }"> <a class="btn btn-info" href="lineSectionDailyInfo/edit/${lineSectionDailyInfo.id }"> </a> </c:when> <c:otherwise> <a class="btn btn-info" href="lineSectionDailyInfo/edit/${lineSectionDailyInfo.id }">${lineSectionDailyInfo.actCplQty }</a> </c:otherwise> </c:choose> </td> <%-- </c:if> --%> </c:if> <c:if test="${status.count%2==0}"> <%-- <c:if test="${lineSectionDailyInfo.timePeriod.shift == 2}"> --%> <td style="vertical-align: middle !important;text-align: center;"><hf:dictionary type="text" cssClass="form-control input-sm" name="shift" group="SCHEDULING_SHIFT" value="${lineSectionDailyInfo.timePeriod.shift }" /></td> <td>${lineSectionDailyInfo.timePeriod.alias }</td> <td>${lineSectionDailyInfo.sectionId }边</td> <td>${lineSectionDailyInfo.planCplQty }</td> <td> <c:choose> <c:when test="${empty lineSectionDailyInfo.actCplQty }"> <a class="btn btn-info" href="lineSectionDailyInfo/edit/${lineSectionDailyInfo.id }"> </a> </c:when> <c:otherwise> <a class="btn btn-info" href="lineSectionDailyInfo/edit/${lineSectionDailyInfo.id }">${lineSectionDailyInfo.actCplQty }</a> </c:otherwise> </c:choose> </td> <%-- </c:if> --%> <tr></tr> </c:if> </c:forEach> </tr> </tbody> </table> </div> <c:forEach items="${curLSDSI }" var="curLSDSI" varStatus="status"> <p class="hidden" id="time${status.count }"><fmt:formatDate value="${curLSDSI.recordDate }" pattern="yyyy-MM-dd"/></p> </c:forEach> <c:forEach items="${curLSDSI }" var="curLSDSI" varStatus="status"> <p class="hidden" id="planSum${status.count }">${curLSDSI.planQty }</p> </c:forEach> <c:forEach items="${curLSDSI }" var="curLSDSI" varStatus="status"> <p class="hidden" id="actSum${status.count }">${curLSDSI.actQty }</p> </c:forEach> <div id="container" style="width: 800px; height: 275px; margin: 0 auto"></div> </div><!-- ./row --> </form> </div><!-- ./wrapper --> <script type="text/javascript"> $(function() { initValid(); k_addInputPrefix(); }); </script> <script type="text/javascript" src="resources/js/bootstrap.min.js"></script> <script type="text/javascript" src="resources/js/jquery.min.js"></script> <script type="text/javascript" src="resources/js/highcharts.js"></script> <script type="text/javascript" src="resources/js/exporting.js"></script> <script type="text/javascript" src="resources/widget/jQuery Validation Plugin/jquery.validate.min.js"></script> <script type="text/javascript" src="resources/js/util.js"></script> <script type="text/javascript" src="resources/widget/layer/layer.js"></script> <script type="text/javascript" src="resources/app/kanban/kanban.js?1.2"></script> <script type="text/javascript" src="resources/app/andon/lineSectionDailyInfo.js" ></script> </body> </html>
原理很简单:在集合中依次输出两条数据到到同一行,之后再进行换行操作。
血肉苦弱机械飞升 :痛苦预示着超脱
本文来自博客园,作者:血肉苦弱机械飞升,转载请注明原文链接:https://www.cnblogs.com/supperlhg/p/9298462.html