动态更新 a4j:repeat 使用表单中的数据答案

【问题标题】：Dynamically updating a4j:repeat using data from form动态更新 a4j:repeat 使用表单中的数据
【发布时间】：2012-02-24 22:53:46
【问题描述】：

我有一个页面，用户可以将文件上传到服务器。他可以设置哪些组/用户可以读/写（到）文件。

这是通过选择完成的。一个选择包含用户当前所在的组的名称，在同一行上是一个带有读取和写入选项的选择。第二行是选择用户对应的东西。

当用户选择一个组并为该组选择读或写时，他然后按下一个按钮。按下按钮后，我想向用户显示选择下方的权限列表。该列表将包含一个组名、该组的访问设置和一个删除权限项的按钮。

我的问题是，我无法更新页面并显示权限列表。服务器端权限被添加到 ArrayList，但我无法让内容显示在 a4j:repeat 中。如何让重复标签更新？

到目前为止，我一直在尝试这样做：

        <h:form>
        <h:selectOneMenu value="#{assetUploadForm.currentGroupName}" valueChangeListener="#{assetUploadForm.groupNameChanged}">
            <f:selectItem itemValue="users" itemLabel="users" />
            <f:selectItem itemValue="foobar" itemLabel="Foobar" />
            <a4j:ajax event="valueChange" render="second" execute="@this" />
        </h:selectOneMenu>

        <h:selectOneMenu value="#{assetUploadForm.currentGroupRW}" valueChangeListener="#{assetUploadForm.groupRWChanged}">
            <f:selectItem itemValue="R" itemLabel="Read"/>
            <f:selectItem itemValue="W" itemLabel="Write"/>
            <a4j:ajax event="valueChange" render="second" execute="@this" />
         </h:selectOneMenu>

        <a4j:commandButton action="#{assetUploadForm.addGroupRights}" value="add group" render="groupList"/>
        <ul>
        <a4j:repeat value="#{assetUploadForm.groupPermissions}" var="permission" id="groupList">
            <li><h:outputText value="#{permission.permissionSetItemId}"/></li>
        </a4j:repeat> 
        </ul>
        </h:form>

所以，问题是 a4j:repeat 永远不会更新。如果我用输出文本替换重复，并将命令按钮设置为呈现它，则页面将“正确”更新。

【问题讨论】：

标签： jsf richfaces ajax4jsf

【解决方案1】：

<a4j:repeat> 不会向响应呈现任何 HTML。但是，<a4j:ajax> 的 render 属性期望具有该 ID 的组件实际存在于 HTML DOM 树中（即在幕后使用 JavaScript document.getElementById() 东西来获取需要在 ajax 响应后更新的元素已返回）。因此，这不可能与<a4j:repeat> 结合使用。您需要指定其最父级的 JSF HTML 组件，或者至少将其包装在一个新组件中。

例如

<a4j:commandButton action="#{assetUploadForm.addGroupRights}" value="add group" render="groupList"/>
<h:panelGroup id="groupList">
  <ul>
    <a4j:repeat value="#{assetUploadForm.groupPermissions}" var="permission">
      <li><h:outputText value="#{permission.permissionSetItemId}"/></li>
    </a4j:repeat> 
  </ul>
</h:panelGroup>

作为另一种选择，您也可以只使用<rich:list> 组件，它已经为您呈现完整的<ul><li>。然后你基本上直接更新<ul>。

<a4j:commandButton action="#{assetUploadForm.addGroupRights}" value="add group" render="groupList"/>
<rich:list id="groupList">
  <h:outputText value="#{permission.permissionSetItemId}"/>
</rich:list>

要了解所有可用的组件以及如何使用它们，请查看showcase site 和component reference。

【讨论】：

这听起来可行:) 我会在几天内尝试一下。非常感谢您的解释！不过，我一直在查看展示和组件参考，恐怕很多事情都没有解释得太深入（例如，我对这个问题没有任何帮助）。我猜一个人必须边做边学:)

【解决方案2】：

我不知道为什么它不起作用，但作为一种变通方法，您可能可以为此使用 h:dataTable。通过一些 css 调整，可以呈现相同的外观。

或者在 a4j:repeat 周围包裹一个 a4j:outputPanel 并尝试渲染它会发生什么。

MAG，米洛·范德泽

【讨论】：