Question

我们正在从jsf 1.2升级到jsf 2。我们正在使用apache myfaces 2.1和富面4.3。

以下是xhtml代码：

 <h:form>
<h:panelGroup id="myMenu_type">

    <div id="myMenu">
         <ul>
        <c:forEach items="#{bean.data}" var="val">
                 <li>
                    <h:commandLink value="#{val.label}" action="#{val.performAction}"/>                                                                                                                    
                 </li>
        </c:forEach>
         </ul>   
     </div>
 </h:panelGroup>
</h:form>

我收到上述xhtml代码的重复ID错误。生成的锚链接标记<a>会获取上述代码的重复ID。

我的问题是，我想摆脱c：forEach，因为我怀疑它正在给出这个重复的id错误，因为我混合JSTL和JSF。

替换上述构造的最佳JSF方法是什么？我正在尝试使用rich：dataTable。还有更好的选择吗？请指教。奇怪的是，使用相同的代码，JSF 1.2没有观察到上述问题。

编辑1：

我尝试过使用<rich:list>以及<a4j:repeat> 下面是xhtml代码

    <div id="myMenu">
                     <rich:list value="#{bean.data}" var="val">
                        #{val}
                     </rich:list>
         </div>

奇怪的是，当我打印#{val}时，它给我的值为javax.faces.component.UIViewRoot@28d0bbac而val是正常的自定义对象。由于上述问题，我不能在val上调用任何方法，它在类型javax.faces.component.UIViewRoot错误上找不到Property'xx'。使用<c:forEach>时未发现上述错误。

编辑2：

我正在为上面的xhtml代码附加生成的html，它清楚地说明了重复ID错误的来源。

 <tr><td>

  <span id="form:myMenu_type">
    <a href="#" onclick="return myfaces.oam.submitForm(id1);">One</a>
    <a href="#" onclick="return myfaces.oam.submitForm(id2);">Two</a>
    <a href="#" onclick="return myfaces.oam.submitForm(id3);">Three</a>
    <a href="#" onclick="return myfaces.oam.submitForm(id4);">Four</a>
    <a href="#" onclick="return myfaces.oam.submitForm(id5);">Five</a>
    <a href="#" onclick="return myfaces.oam.submitForm(id6);">Six</a>
                <div id="myMenu">
                            <ul>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id1);">One</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id2);">Two</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id3);">Three</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id4);">Four</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id5);">Five</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id6);">Six</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id7);">Seven</a>
                                    </li>
                                    <li ><a href="#" onclick="return myfaces.oam.submitForm(id8);">Eight</a>
                                    </li>                               
                           </ul>
                    </div>
  </span>       
</td></tr>

因此，如上面的代码所示，生成在右下方的锚链接标记<a>：myMenu_type是真正的问题。它的id与<li>中生成的id完全相同 - 这是正确的，因为我明确地使用<li>。为什么生成锚标签是真正的问题。即使我在<c:forEach>内动态分配ID，也会将相同内容分配给上面的<a>个链接，从而产生相同的重复ID错误。我用虚拟ID来解释这个问题。实际ID是myFaces生成的动态ID

Answer 1

使用ui：重复JSF

示例：

<ui:repeat value="#{productMB.products}" var="product">
<table class="cart">
  <tr>
    <td class="image">
      <div id="image_container">
        <img title="#{product.type} #{product.mark} #{product.family} #{product.subfamily} #{product.model} #{product.partNumber}" src="#{product.imageURL}"/>
      </div>        
    </td>
  </tr>
</table>
</ui:repeat>

使用JSF标记替换c：forEach的最佳方法

1 个答案: