rendering values of multiple select boxes in a JSF form

Question

Hi so in my JSF form I have three select boxes.This is the code:

<h:form id="newRequestForm">
                <h1>New Request</h1>
                <br/>
                <h:panelGrid columns="4">


                    <h:selectOneMenu id="issueID" style="margin-left: 3px;" value="#{mycontroller.requestType}">
                        --few items----
                        <f:ajax event="change" listener="#{mycontroller.changeTypeList}"  render="selectDevice" execute="@this" />
                    </h:selectOneMenu>


                <br/>

                <div id="sessionDiv" columns="2">

                    <h:selectOneMenu id="selectRole" style="margin-left: 29px;" value="#{mycontroller.roleID}">
                        <f:selectItems  value="#{mycontroller.roleList}"  itemValue="#{mycontroller.roleList}"/>
                    </h:selectOneMenu>  
                </div>
                <div id="deviceDiv" columns="2">

                    <h:selectOneMenu id="selectDevice" style="margin-left: 18px;" value="#{mycontroller.userId}">
                        <f:selectItems  value="#{mycontroller.deviceList}" var="device" itemValue="#{device.deviceId}"/>
                    </h:selectOneMenu> 
                </div>
                <div id="userDiv" columns="2">

                    <h:selectOneMenu id="selectUser" style="margin-left: 50px;" value="#{mycontroller.userIdReq}">
                        <f:selectItems  value="#{mycontroller.usersList}"  var="user" itemValue="#{user.userId}"/>
                    </h:selectOneMenu> 
                </div>
                <br/>

                <br/>

                <h:commandButton action="#{requestSupportController.submitRequest}"   value="Submit Request" style="margin-top: 20px"/>   

            </h:form>

Now when the form first loads the last three divs are hidden and based on the drop down values of the first div the reminaing divs are shown.Now in my ajax event I use render="selectDevice" which populates the values in that drop down.

I actually have three scenarios: a)If the selected item in the first div is "Roles" all the roleId should be populated in the second div b)If the selected item in the first div is "Device" all the deviceID should be populated in the third div c)If the selected item in the first div is "Users" all the userIDshould be populated in the fourth div

How can i achieve this as render can only render one div.When i used render="@form" then all divs are shown instead of being hidden.

Answer 1

How about adding rendered attribute with proper condition to h:selectOneMenu? Then you should be able to use render="@form" / render="selectRole selectDevice selectUser" without any problems. (see Render other selectOneMenu components after selection of one selectOneMenu)