f:ajax 在 ui:repeat 中，组件的id未知。

Question

当我尝试通过ajax调用渲染panelGroup时，它会给出未知的id。

<h:form id="form1" prependId=false>
  <h:panelGroup id="panel1">
       <h:dataTable/>
       <ui:repeat value="#{bean.page}" var="page">
          <h:commandLink value="#{page}">
              <f:ajax execute="@form" render="panel1" listener="#{bean.page}" />
          </h:commandLink>
       </ui:repeat>
  </h:panelGroup>     
 </h:form>

当我尝试运行这段代码，它会显示未知的id panel1。我也尝试了使用id“：panel1”，但是仍然出现相同的错误。

- user679526

---

你为什么编辑代码将 </h:panelGroup> 移到另一端？ - BalusC

ui:repeat位于panelGroup内部。因此，我不得不移动到另一端。 - user679526

好的，我也会编辑我的答案中的代码片段。但是技术上的回答不会改变。 - BalusC

Answer 1

一个相对的客户端ID（即不以:开头）是相对于当前父NamingContainer组件。 <ui:repeat>也是一个NamingContainer。因此，render="panel1"正在寻找<ui:repeat>上下文中的组件。这样是行不通的。绝对客户端ID（即以:开头）是在视图根上下文中查找组件。但是，您将其放在了一个<h:form>中-这又是另一个NamingContainer组件，因此render=":panel"也不会起作用。

以下应该可以工作，去除prependId="false"，以便您可以引用它:

<h:form id="form1">
  <h:panelGroup id="panel1">
    <h:dataTable/>

    <ui:repeat value="#{bean.page}" var="page">
      <h:commandLink value="#{page}">
        <f:ajax execute="@form" render=":form1:panel1" listener="#{bean.page}" />
      </h:commandLink>
    </ui:repeat>
  </h:panelGroup> 
</h:form>

顺便提一下，如果你真正地只想呈现表格，那么你应该这样做：

<h:form id="form1">
  <h:panelGroup>
    <h:dataTable id="table1" />

    <ui:repeat value="#{bean.page}" var="page">
      <h:commandLink value="#{page}">
        <f:ajax execute="@form" render=":form1:table1" listener="#{bean.page}" />
      </h:commandLink>
    </ui:repeat>
  </h:panelGroup> 
</h:form>

更新：根据评论，发现您已通过配置更改了JSF默认的NamingContainer分隔符，从 : 变成了 _。在这种情况下，您需要在客户端ID选择器中使用_而不是:。

<f:ajax execute="@form" render="_form1_panel1" listener="#{bean.page}" />

- BalusC

---

叹气。查看HTML源代码。<h:panelGroup id="panel1">的生成ID是什么？ - BalusC

我使用了render="_form_panel1"。现在它可以工作了。非常感谢您的帮助和时间。 - user679526

不用谢。如果将默认分隔符从“：”更改为“_”是为了解决CSS选择器问题，则您可能会发现这个答案很有用，其中显示了替代方法：https://dev59.com/KW025IYBdhLWcg3wqXxo - BalusC

谢谢你的回答。最终我完全理解了这个案例。 - Mateusz Gaweł

@Emerald214：永远不要使用prependId。它是JSF 1.2的一个没有经过深思熟虑的遗留问题。 - BalusC

Answer 2

<ui:repeat value="#{interaction.interactionListBean}" var="interactionItr"> 

    <h:commandLink value="#{interactionItr.interactionDate}"  styleClass="#{interaction.createImage}" style="margin:0 5px 5px 0!important; display:inline-block;"><br/>
        <f:ajax  render=":formId:interactionDate :formId:category :formId:activity :formId:status :formId:channel :formId:status1 :formId:caseId :formId:comment :formId:user1 :formId:team :formId:user :formId:transit "  
                    listener="#{interactionController.interactionDetailGet}"/> 
        <f:param name="RefId" value="#{interaction.interactionRefId}"/> 
    </h:commandLink>

</ui:repeat> 

问题: 请参考上述代码，控制台没有异常，但是当我看到这篇文章时，类似的概念被使用，只是我将`execute="@form"`放置在那里，然后我的代码就可以正常工作了。

解决方案:

`

execute="@form"

`

- user2636226