java - JSF 和 ui 中的嵌套 ajax :repeat

Question

<h:form>
    <fieldset>
        <h:selectManyListbox id="listbox" value="#{form.items}">
            <f:selectItems value="#{form.allItems}">
        </h:selectManyListbox>
    </fieldset>
    <h:commandButton value="Get Table" action="#{form.getTable}">
        <f:ajax render="result_table" execute="listbox" />
    </h:commandButton>
    <h:panelGrid id="result_table">
        <table>
            <thead></thead>
            <tbody>
                <ui:repeat var="table" value="#{form.resultTable}">
                    <tr>
                         <td>#{table.name}</td>
                         <td>
                             <h:selectBooleanCheckbox binding="#{showMore}">
                                 <f:ajax render="inner" />
                             </h:selectBooleanCheckbox>
                         </td>
                    </tr>
                    <tr>
                         <td>
                             <h:panelGrid id="inner" rendered="#{not empty showMore.value and showMore.value}">
                                 <table></table>
                             </h:panelGrid>
                         </td>
                    </tr>
                </ui:repeat>
            </tbody>
        </table>
    </h:panelGrid>
</h:form>     

我遵循了 BalusC 中的复选框示例代码 here .

当我单击命令按钮时，它会根据列表框值生成一个表格结果，我将其显示在 h:panelGrid id="result_table" 中.此命令按钮有效。在生成的表中，我有一些要显示的子表，但前提是我选中了显示它们的框。对于复选框，如果我使用 render="@form"它折叠了我的外部父表。如果我使用 render="inner"选中/取消选中框不会执行任何操作。

我如何让它工作？是不是两个ajax冲突了？

仅供引用，我也尝试使用 bean 属性，但得到了相同的结果。当我尝试使用同一链接中提到的 javascript 方法时，选中/取消选中该框无效。

已更新以添加示例片段和 <ui:repeat></ui:repeat>以上:

<h:selectBooleanCheckbox binding="#{showMore}">
     <f:ajax render="inner" />
 </h:selectBooleanCheckbox>
 <h:panelGrid id="inner">
     <h:outputText value="always" />
     <h:outputText value="hidden" rendered="#{not empty showMore.value and showMore.value}" />
 </h:panelGrid>

Answer 1

罪魁祸首在这里:

<h:panelGrid id="inner" rendered="#{not empty showMore.value and showMore.value}">
    <table></table>
</h:panelGrid>

f:ajax 使用 JavaScript 在客户端定位要渲染的元素。当 JSF 未将其呈现给客户端时，JavaScript 将无法定位 inner 面板网格的 HTML 表示形式。将 inner id 放在始终呈现给客户端的父组件中，这样 Ajax/JavaScript 就可以找到它，而不管 rendered 条件如何。例如:

<h:panelGroup id="inner">
    <h:panelGrid rendered="#{not empty showMore.value and showMore.value}">
        <table></table>
    </h:panelGrid>
</h:panelGroup>

---

更新:根据评论，使用ui:repeat 应该不会在这里形成问题。更重要的是，为了确保我已将您的示例复制粘贴到我的 Playground 环境中并且它工作正常(在 Tomcat 6.0.29 上使用 Mojarra 2.0.3)。 bean 被标记为 @ViewScoped .也许你的是@RequestScoped并且 ui:repeat 的值的加载是基于一些请求范围内的条件，而这些条件没有保留在后续的 ajax 调用中？

另见:

• The benefits and pitfalls of @ViewScoped - 解释 @ViewScoped
的值
• What are the main disadvantages of JSF 2.0? - 一点历史