Ajax update/render does not work on a component which has rendered attribute

54
votes

I'm trying to ajax-update a conditionally rendered component.

<h:form>
    ...
    <h:commandButton value="Login" action="#{login.submit}">
        <f:ajax execute="@form" render=":text" />
    </h:commandButton>
</h:form>
<h:outputText id="text" value="You're logged in!" rendered="#{not empty user}" />

However, that does not work. I can assure that #{user} is actually available. How is this caused and how can I solve it?

1
jsfjsf-2rendered-attributeconditional-renderingajax-update

1 Answers

102
votes

It's not possible to re-render (update) a component by ajax if the component itself is not rendered in first place. The component must be always rendered before ajax can re-render it. Ajax is using JavaScript document.getElementById() to find the component which needs to be updated. But if JSF hasn't rendered the component in first place, then JavaScript can't find anything to update.

The solution is to simply reference a parent component which is always rendered.

<h:form>
    ...
    <h:commandButton ...>
        <f:ajax ... render=":text" />
    </h:commandButton>
</h:form>
<h:panelGroup id="text">
    <h:outputText ... rendered="#{not empty user}" />
</h:panelGroup>

See also: