Conditional rendering in JSF

jsf, jsf-2, page-refresh, rendering

Solution

The JSF component's `rendered` attribute is a server-side setting which controls whether JSF should generate the desired HTML or not.

The `<f:ajax>` tag's `render` attribute should point to a (relative) client ID of the JSF-generated HTML element which JavaScript can grab by `document.getElementById()` from HTML DOM tree in order to replace its contents on complete of the ajax request.

However, since you're specifying the client ID of a HTML element which is never rendered by JSF (due to `rendered` being `false`), JavaScript can't find it in the HTML DOM tree.

You need to wrap it in a container component which is always rendered and thus always available in the HTML DOM tree.

<h:commandButton action="#{Bean.method()}"  value="Submit">
   <f:ajax execute="something" render="messages" />
</h:commandButton>

<p>
    <h:panelGroup id="messages">
        <h:outputFormat rendered="#{Bean.answer=='one'}" value="#{messages.one}"/>
        <h:outputFormat rendered="#{Bean.answer=='two'}" value="#{messages.two}"/>
    </h:panelGroup>
</p>

Unrelated to the concrete problem, you've there a possible design mistake. Why would you not just create a `#{Bean.message}` property which you set with the desired message in the action method instead, so that you can just use:

<h:commandButton action="#{Bean.method()}"  value="Submit">
   <f:ajax execute="something" render="message" />
</h:commandButton>

<p>
    <h:outputFormat id="message" value="#{Bean.message}" />
</p>

Problem

Hello I have this code to conditionally render components in my page: ``` <h:commandButton action="#{Bean.method()}" value="Submit"> <f:ajax execute="something" render="one two" /> </h:commandButton> <p><h:outputFormat rendered="#{Bean.answer=='one'}" id="one" value="#{messages.one}"/></p> <p><h:outputFormat rendered="#{Bean.answer=='two'}" id="two" value="#{messages.two}"/></p> ``` It gets the answer and renders the component but in order to see it on my page, I need to refresh the page. How can I fix this problem? Any suggestions?

Original source

Related problems