使用 ice:panelSeries 中的索引值有条件地附加包装器 div

Question

我有这个 UI 结构：

<ice:panelSeries value="#{bean.list}" var="item" varStatus="vs">
    <div class="row-fluid">
        <div class="span6"></div>
    </div>
</ice:panelSeries>

我想使用模块条件#{vs.index % 2 == 0} 创建div.row-fluid，以便在两个span6 div 之后附加div.row-fluid，以创建动态网格视图。

我尝试过使用rendered="#{vs.index % 2 == 0}" 用ice:panelGroup 包裹的内部内容，但这会在条件变为真时隐藏该行。

另外，我尝试用c:if 标签包装div.row-fluid，就像我们通常在其他一些语言中动态创建html元素一样：

<c:if test="#{vs.index % 2 == 0}"><div class="row-fluid"><c:if>
    <div class="span4"></div>
<c:if test="#{vs.index % 2 == 0}"></div><c:if>

这会导致页面崩溃，提示 <div> 未正确关闭。 主要问题是我必须放置单独的打开和关闭 div。

有没有办法在 JSF 中使用 icefaces 组件实现这一点？？？

Answer 1

您有两种选择，具体取决于您的实际成就：

1. 如果您想静态控制（在服务器端）必须如何显示内容，只需将 bean 放入二维数组而不是列表中，然后在 UI 声明中使用两个嵌套循环
2. 如果行没有任何商业意义，而只是作为最好地利用水平监视器空间的一种手段，则使用一些网格框架专门在客户端工作，可能以响应方式。例如 Twitter Bootstrap 之一can write:

<div class="container">
    <div class="row">
      <div class="col-md-6 O"></div>
      <div class="col-md-6 O"></div>
      <div class="col-md-6 O"></div>
      <div class="col-md-6 O"></div>
    </div>
</div>

不在标记中创建多行

Answer 2

这会导致页面崩溃，提示 <div> 未正确关闭

您可以通过 <h:outputText escape="false"> 传递转义的 XML 来欺骗这个。

<h:outputText value="&lt;div class=&quot;row-fluid&quot;&gt;" escape="false" rendered="#{vs.index mod 2 eq 0}" />
    <div class="span4"></div>
<h:outputText value="&lt;/div&gt;" escape="false" rendered="#{vs.index mod 2 eq 0}" />