使用引导程序重复行

Question

我正在尝试将我的网站格式化为bootstrap custom content component。麻烦的是xml正在被解析，并不是因为我还没有关闭我的div标签。这假设我的组中有3的倍数。

代码（更新为我的完整代码）：

 <ui:repeat var="crs" value="#{groups.getGroupRows(true)}" varStatus="status">

                    <c:if test="${(status.index mod 3) == 0}">
                        <div class="row">
                    </c:if>

                    <div class="col-sm-6 col-md-4">
                        <div class="thumbnail">
                            <ui:repeat value="#{crs.getObject('imageFiles').files}" var="image">  
                                <h:link outcome="viewClassesInGroup" id="group_name" styleClass="thumbnail">
                                    <f:param name="group_id" id="group_id" value="#{crs.getInteger('group_id')}"/>
                                    <img src="#{image.imageAbsoluteUrl('large')}" data-src="holder.js/300x200" />
                                </h:link>
                            </ui:repeat>
                            <div class="caption">
                                <h3><h:link outcome="viewClassesInGroup"  id="group_name" value="#{crs.string}">
                                        <f:param name="group_id" id="group_id" value="#{crs.getInteger('group_id')}"/>
                                    </h:link></h3>
                                <p><h:outputText id="group_description" value="#{crs.string}"/></p>
                                <p><a href="#" class="btn btn-primary" role="button">View Group</a></p>
                            </div>
                        </div>
                    </div>

                    <c:if test="${(status.index mod 3) == 0}">
                        </div>
                    </c:if>

                </ui:repeat>

错误：

SEVERE: Servlet.service() for servlet [Faces Servlet] in context with path [] threw exception [Error Parsing /index.xhtml: Error Traced[line: 31] The element type "div" must be terminated by the matching end-tag "</div>".] with root cause
javax.faces.view.facelets.FaceletException: Error Parsing /index.xhtml: Error Traced[line: 31] The element type "div" must be terminated by the matching end-tag "</div>".
    at com.sun.faces.facelets.compiler.SAXCompiler.doCompile(SAXCompiler.java:450)
    at com.sun.faces.facelets.compiler.SAXCompiler.doMetadataCompile(SAXCompiler.java:433)
    at com.sun.faces.facelets.compiler.Compiler.metadataCompile(Compiler.java:130)
    at com.sun.faces.facelets.impl.DefaultFaceletFactory.createMetadataFacelet(DefaultFaceletFactory.java:495)
    at com.sun.faces.facelets.impl.DefaultFaceletFactory.access$200(DefaultFaceletFactory.java:106)
    at com.sun.faces.facelets.impl.DefaultFaceletFactory$2.newInstance(DefaultFaceletFactory.java:205)
    at com.sun.faces.facelets.impl.DefaultFaceletFactory$2.newInstance(DefaultFaceletFactory.java:203)
    at com.sun.faces.facelets.impl.DefaultFaceletCache$2.newInstance(DefaultFaceletCache.java:97)
    at com.sun.faces.facelets.impl.DefaultFaceletCache$2.newInstance(DefaultFaceletCache.java:92)
    at com.sun.faces.util.ExpiringConcurrentCache$1.call(ExpiringConcurrentCache.java:99)
    at java.util.concurrent.FutureTask.run(FutureTask.java:262)
    at com.sun.faces.util.ExpiringConcurrentCache.get(ExpiringConcurrentCache.java:114)
    at com.sun.faces.facelets.impl.DefaultFaceletCache.getViewMetadataFacelet(DefaultFaceletCache.java:146)
    at com.sun.faces.facelets.impl.DefaultFaceletCache.getViewMetadataFacelet(DefaultFaceletCache.java:63)
    at com.sun.faces.facelets.impl.DefaultFaceletFactory.getMetadataFacelet(DefaultFaceletFactory.java:316)
    at com.sun.faces.facelets.impl.DefaultFaceletFactory.getMetadataFacelet(DefaultFaceletFactory.java:246)
    at com.sun.faces.application.view.ViewMetadataImpl.createMetadataView(ViewMetadataImpl.java:113)
    at com.sun.faces.lifecycle.RestoreViewPhase.execute(RestoreViewPhase.java:241)
    at com.sun.faces.lifecycle.Phase.doPhase(Phase.java:101)
    at com.sun.faces.lifecycle.RestoreViewPhase.doPhase(RestoreViewPhase.java:121)
    at com.sun.faces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:198)
    at javax.faces.webapp.FacesServlet.service(FacesServlet.java:646)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:303)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:208)
    at org.primefaces.webapp.filter.FileUploadFilter.doFilter(FileUploadFilter.java:70)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:241)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:208)
    at org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:241)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:208)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:220)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:122)
    at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:501)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:170)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:98)
    at org.apache.catalina.valves.AccessLogValve.invoke(AccessLogValve.java:950)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:116)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:408)
    at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp11Processor.java:1040)
    at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:607)
    at org.apache.tomcat.util.net.JIoEndpoint$SocketProcessor.run(JIoEndpoint.java:313)
    at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1145)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:615)
    at java.lang.Thread.run(Thread.java:744)

更新

我尝试过匹配表达式，以及切换测试的位置。它仍然抛出一个javax.faces.view.facelets.FaceletException：错误解析/index.xhtml

Answer 1

我是新来的，

我在jsf中使用bootstrap搜索了几行的解决方案。当我在这里查看解决方案时，我甚至没有看过这个，因为它看起来有点过载。为什么我想出了自己的解决方案。我希望它更清楚。

MySolution：

<div class="container">
  <ui:repeat step="3" value="#{bean.list}" varStatus="outerLoopIndex">
      <div class="row">
          <ui:repeat offset="#{outerLoopIndex.index}" size="#{(outerLoopIndex.index + 3) gt bean.list.size() ? bean.list.size() : outerLoopIndex.index + 3}" 
          var="item" value="#{bean.list}" varStatus="innerLoopIndex">
           <div class="col-4">
            <label class="btn btn-secondary active">
                #{innerLoopIndex.index} #{item.foo}
            </label>
           </div>
          </ui:repeat>
      </div>
  </ui:repeat>
</div> <!-- container -->

如果要逐行更改列数，则必须在外部重复元素中调整步骤，内部重复元素中的大小，当然还要调整div元素的col类。

更改COLUMNSPERROW：

<ui:repeat step="COLUMNSPERROW" var="permission" value="#{bean.list}" varStatus="outerLoopIndex">
      <div class="row">
          <ui:repeat offset="#{outerLoopIndex.index}" size="#{(outerLoopIndex.index + COLUMNSPERROW) gt bean.list.size() ? bean.list.size() : outerLoopIndex.index + COLUMNSPERROW}" 
          var="item" value="#{bean.list}" varStatus="innerLoopIndex">
           <div class="col">

这是我的第一篇文章。 我愿意接受改进建议。

Answer 2

我切换到的解决方案使用双循环和4列而不是3。

<c:forEach var="i" begin="1" end="#{(groups.getGroupRows(true).size() / 4) +(1-((groups.getGroupRows(true).size() / 4) %1))%1}">
                    <div class="row">
                        <c:forEach var="x" begin="${((i - 1) * 4)}" end="${(((i - 1) * 4) + 3)}">
                            <c:if test="${(groups.getGroupRows(true).size() - 1) ge x}">
                                <div class="col-sm-4 col-md-3">
                                    <div class="thumbnail">
                                        <ui:repeat value="#{groups.getGroupRows(true).get(x).getObject('imageFiles').files}" var="image">  
                                            <h:link outcome="viewClassesInGroup" id="group_name">
                                                <f:param name="group_id" value="#{groups.getGroupRows(true).get(x).getInteger('group_id')}"/>
                                                <img src="#{image.imageAbsoluteUrl('large')}"/>
                                            </h:link>
                                        </ui:repeat>
                                        <div class="caption">
                                            <h3><h:link outcome="viewClassesInGroup" value="#{groups.getGroupRows(true).get(x).getString('group_name')}">
                                                    <f:param name="group_id" value="#{groups.getGroupRows(true).get(x).getInteger('group_id')}"/>
                                                </h:link></h3>
                                            <p><h:outputText value="#{groups.getGroupRows(true).get(x).getString('group_description')}"/></p>
                                            <p><h:link outcome="viewClassesInGroup" styleClass="btn btn-primary" p:role="button" value="View Group">
                                                    <f:param name="group_id" value="#{groups.getGroupRows(true).get(x).getInteger('group_id')}"/>
                                                </h:link>
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </c:if>
                        </c:forEach>
                    </div>
                </c:forEach>

虽然它不像我想的那么优雅。它仍然解决了这个问题。

Answer 3

第一个if和second永远不会匹配相同的索引，事实上它最终会出现在因为（status.index + 1）

之前

所以你最终得到了

</div>
    <div class="col-sm-6 col-md-4">
        ...
    </div>
<div>
</div>
    <div class="col-sm-6 col-md-4">
        ...
    </div>
</div>

或类似的东西可以解释你得到的错误。