Render other selectOneMenu components after selection of one selectOneMenu

Question

I want to have multiple <h:selectOneMenu> that are displayed by selection of main <h:selectOneMenu>

example which is not working

<h:form id="selectForm">
    <h:selectOneMenu id="main" value="#{bean.main}">
         <f:selectItem itemValue="1" itemLabel="1"/>
         <f:selectItem itemValue="2" itemLabel="2"/>
         <f:selectItem itemValue="3" itemLabel="3"/>
         <f:selectItem itemValue="4" itemLabel="4"/>
         <f:ajax render="hotelSearch"/>
    </selectOneMenu>
    //this one is displayed if main is greater than 1
    <h:selectOneMenu id="2" rendered="main>1">
         <f:selectItem itemValue="1" itemLabel="1"/>
         <f:selectItem itemValue="2" itemLabel="2"/>
         <f:selectItem itemValue="3" itemLabel="3"/>
         <f:selectItem itemValue="4" itemLabel="4"/>
    </h:selectOneMenu>
    //this one is displayed if main is greater than 2
    <h:selectOneMenu id="3" rendered="main>2">
         <f:selectItem itemValue="1" itemLabel="1"/>
         <f:selectItem itemValue="2" itemLabel="2"/>
         <f:selectItem itemValue="3" itemLabel="3"/>
         <f:selectItem itemValue="4" itemLabel="4"/>
    </h:selectOneMenu>
</h:form>

How can I achieve this?

score 6 · Accepted Answer · edited Jun 20 '20 at 09:12

You need to make it a valid EL expression #{}.

(update: code example is updated to reflect the new functional requirement to make it to work without the need for a managed bean)

<h:form id="selectForm">
    <h:selectOneMenu binding="#{mainMenu}">
        <f:selectItem itemValue="1" itemLabel="1"/>
        <f:selectItem itemValue="2" itemLabel="2"/>
        <f:selectItem itemValue="3" itemLabel="3"/>
        <f:selectItem itemValue="4" itemLabel="4"/>
        <f:ajax render="@form"/>
    </h:selectOneMenu>

    <h:selectOneMenu rendered="#{mainMenu.value gt 1}">
        <f:selectItem itemValue="1" itemLabel="1"/>
        <f:selectItem itemValue="2" itemLabel="2"/>
        <f:selectItem itemValue="3" itemLabel="3"/>
        <f:selectItem itemValue="4" itemLabel="4"/>
    </h:selectOneMenu>

    <h:selectOneMenu rendered="#{mainMenu.value gt 2}">
        <f:selectItem itemValue="1" itemLabel="1"/>
        <f:selectItem itemValue="2" itemLabel="2"/>
        <f:selectItem itemValue="3" itemLabel="3"/>
        <f:selectItem itemValue="4" itemLabel="4"/>
    </h:selectOneMenu>
</h:form>

Note that I used gt instead of > as it's an illegal character in XML. You can find all EL operators in the Java EE tutorial.

Render other selectOneMenu components after selection of one selectOneMenu

1 Answers1

See also: