Geek Answers Handbook

Hide / Show the form depending on the change in the value of selectOneMenu

I have a page with <h:selectOneMenu>and I want to show some fields or others depending on the selected selectOneMenu value. Is this possible, and if so, how?

+5
source share
1 answer

Yes, it is certainly possible. Just bind the dropdown value to the attribute renderedfor the components to be shown / hidden. Here is an example run.

<h:form>
    <h:selectOneMenu value="#{bean.item}">
        <f:selectItem itemLabel="Select..." />
        <f:selectItem itemValue="one" />
        <f:selectItem itemValue="two" />
        <f:selectItem itemValue="three" />
        <f:ajax render="@form" />
    </h:selectOneMenu>

    <h:panelGroup rendered="#{bean.item == 'one'}">
        <p>This will be shown if the selected item equals to "one".</p>
    </h:panelGroup>

    <h:panelGroup rendered="#{bean.item == 'two'}">
        <p>This will be shown if the selected item equals to "two".</p>
    </h:panelGroup>

    <h:panelGroup rendered="#{bean.item == 'three'}">
        <p>This will be shown if the selected item equals to "three".</p>
    </h:panelGroup>
</h:form>

<h:panelGroup>is just a trial. It could be every HTML JSF component, for example, <h:inputText>or another <h:selectOneMenu>.

See also:

+19
source

More articles:


All Articles