Question

I have a <h:selectOneListbox> that appears when a <h:commandbutton> is clicked. When the user selects from the listbox I want the selected value to appear in a <h:inputText> and hide the listbox.

I can’t make the <h:selectoneListbox> stop rendering once it appears. The rendered attribute works fine when the view first appears, but is ignored after I click the list and the listener is invoked.

Any ideas?

Here is the Facelet:

<h:panelGroup>
    <h:inputText id="TitleText" value="#{bindingScheduleHandler.title}"/>
    <h:commandButton value="Clients" actionListener= #bindingScheduleHandler.clientList}" />

    <h:selectOneListbox id="listBox" value="#{bindingScheduleHandler.clients}" size="5"  
        rendered="#{bindingScheduleHandler.showClients}">
        <f:selectItems value="#{bindingScheduleHandler.clientLabelsValues}" />
        <f:ajax event="click" listener="#{bindingScheduleHandler.clickListener}"  
            render="TitleText" />
    </h:selectOneListbox>
</h:panelGroup>

Here is the backing bean:

public void clickListener(AjaxBehaviorEvent event) {
    this.title = clients;
    showClients = false;
    renderClientList = false;
}

Answer 1

In the <f:ajax render>, you can’t refer components which are conditionally rendered by JSF. Instead, you need to refer a parent component which is always rendered. The simple explanation is that the <f:ajax> is using JavaScript to update the content (the node value) of the HTML element as represented by the JSF component. It isn’t possible to show/hide the HTML element itself.

Just update a parent component instead.

<h:panelGroup id="group">
    <h:inputText id="TitleText" value="#{bindingScheduleHandler.title}"/>
    <h:commandButton value="Clients" actionListener= #bindingScheduleHandler.clientList}" />

    <h:selectOneListbox id="listBox" value="#{bindingScheduleHandler.clients}" size="5"  
        rendered="#{bindingScheduleHandler.showClients}">
        <f:selectItems value="#{bindingScheduleHandler.clientLabelsValues}" />
        <f:ajax event="click" listener="#{bindingScheduleHandler.clickListener}"  
            render="group" />
    </h:selectOneListbox>
</h:panelGroup>

This will by the way also instantly fix the problem of the selected item not being displayed in the <h:inputText> 🙂