java - JSF、AJAX、使用 selectOneMenu 更新动态表

Question

我是 jsf 的新手，我一直在用 ajax 更新表。

我需要一个与选择菜单一起工作的表格，该表格需要在更改时刷新。 表格的列取决于菜单值，每个值的列数可以不同。

我的代码:

<h:form>
        <h:selectOneMenu id="selectOneMenu"  value="#{reservationGuestBean.currentPremiseId}" >
            <f:selectItems value="#{reservationGuestBean.premiseNames}" var="p" itemLabel="#{p.label}" itemValue="#{p.value}" />
            <a4j:ajax event="change" listener="#{reservationGuestBean.premiseChanged}" ajaxSingle="true" render=":currentPremiseId, :reservationsHeading, :reservationsBody" />
        </h:selectOneMenu> 
    </h:form>
    <div><h:outputText id="currentPremiseId" value="PremiseId: #{reservationGuestBean.currentPremiseId}" /></div>
    <table id="reservationsTable">
        <tr>
            <ui:repeat id="reservationsHeading" var="col" value="#{reservationGuestBean.reservationTableHeading}">
                <th>#{col}</th>
            </ui:repeat>
        </tr>
        <ui:repeat id="reservationsBody" var="row" value="#{reservationGuestBean.reservationTableRows}">
            <tr>
                <ui:repeat id="reservationsRowContent" var="cell" value="#{row}">
                    <td>#{cell.value}</td>
                </ui:repeat>
            </tr>
        </ui:repeat>
    </table>

使用代码我可以重新加载 div 的内容，但不能重新加载表格、标题和内容。 在 Firebug 中，我可以看到具有所需响应的更新请求(带有 的 xml)，但选定的表格元素未更新。

Answer 1

快速而肮脏的答案只是将您的表包装在 h:panelGroup 中，并在 a4j:ajax 的渲染标签上使用它的 id:

<h:panelGroup id="myTable">
    <table>
    ...
    </table>
</h:panelGroup>

话虽如此，您可能想学习使用组件 h:datatable 而不是自己使用 ui:repeat 重新生成表格。

它易于使用，并且它将成为 JSF View 中的一个有意义的组件，而纯 HTML 表格则不是(这就是为什么您不能只在 ajax 标记中重新呈现它)。您可以先做 the examples in this article .