a4j:ajax 不会渲染 h:panelgrid

Question

这是代码：

<h:panelGrid columns="3" style="margin-left: auto; margin-right:auto;">
    <f:facet name="header">
        <rich:column colspan="2">
            <h:outputText value="Ingrese datos del padre" />
        </rich:column>
    </f:facet>

    <label for="padreRut">RUT</label>
    <h:inputText id="padreRut" value="#{IngresoAlumno.padre.per_Rut}">
        <a4j:ajax event="keyup" render="formPadre" immediate="true" />
        <f:validateLongRange minimum="0" />
    </h:inputText>
    <rich:message for="padreRut" ajaxRendered="true" />
</h:panelGrid>

<h:panelGrid id="formPadre" columns="3" style="margin-left: auto; margin-right:auto;" rendered="#{IngresoAlumno.padre.per_Rut gt 0}">
//...From here on there are form elements

问题是当我触发事件时，第二个 panelGrid 不会呈现。我在这里做错了吗？提前谢谢你。

Answer 1

ajax 魔法由运行在客户端并在 HTML DOM 树上运行的 JavaScript 代码执行。通过指定 render="someId"，您基本上是在告诉 JavaScript 用检索到的 ajax 响应中的新 HTML 表示替换具有给定 ID 的 JSF 组件的 HTML 表示。

但是，如果具有给定 ID 的 JSF 组件的 HTML 表示不是首先由 JSF 呈现，那么 JavaScript 在 HTML DOM 树中找不到要替换的任何内容。

这就是您的情况。您应该指定 始终 呈现的 JSF 组件的 ID，以便 JavaScript 可以在必要时在 HTML DOM 树中找到并更新它。您可以为此使用<h:panelGroup>。

<a4j:ajax ... render="formPadre" />
...
<h:panelGroup id="formPadre">
    <h:panelGrid ... rendered="#{IngresoAlumno.padre.per_Rut gt 0}">
        ...

另见：

• Communication in JSF 2.0 - Ajax rendering of content which is by itself conditionally rendered