Question

<f:view>
 <h:form>
  <h:panelGrid>
   <f:facet name="header">
    <h:outputText value="Create Order"/>
   </f:facet>
   <h:column>
    <h:outputText value="Customer Number : "></h:outputText>
    <h:inputText value="#{SalesCreate.orderBean.customerNumber}"/>
   </h:column>
   <h:column>
    <h:outputText value="Create With : "></h:outputText>
     <h:selectOneMenu id="createWith" value="#{SalesCreate.orderBean.createWith}">
      <f:selectItem itemLabel="Without Reference" itemValue="noRef"/>
      <f:selectItem itemLabel="Reference" itemValue="ref"/>                            
     </h:selectOneMenu>
    </h:column>        
    <h:column>
     <h:outputText value="Reference By : "></h:outputText>
      <h:selectOneMenu id="refBy" value="#{SalesCreate.orderBean.referenceBy}">
       <f:selectItem itemLabel="Quotation" itemValue="quotation"/>
       <f:selectItem itemLabel="Contract" itemValue="contract"/>
      </h:selectOneMenu>
     </h:column>  
     <h:column>
     <h:outputText value="Inquiry Reference Number : "></h:outputText>
      <h:inputText id="docNum" value="#{SalesCreate.orderBean.referenceNum}"/>
      <h:commandButton value="..." onclick="javascript:popUp('OpenRef.jsp',this)">                          
      </h:commandButton>
      <h:commandButton value="Load" action="#{SalesCreate.getQuotationListFromDb}">                  </h:commandButton>                        
     </h:column>           
   </h:panelGrid>
  </h:form>
 </f:view>

Above is my JSP which contains selectOneMenu, I’m trying to enable the field referenceBy only if the user selects withReference in the previous field. Also depending on the value of referenceBy the values in the popup should differ i.e., id user selects referenceBy as quotation, values in the popup should be related to quotation.
the popup JSP contains a datatable with values from a database.

Answer 1

Use <f:ajax> to re-render the second dropdown on change of the first dropdown with help of the new JSF 2.0 ajax powers and use the disabled attribute to disable the second dropdown when the value of the first dropdown is not ref.

<h:selectOneMenu id="createWith" value="#{SalesCreate.orderBean.createWith}">
  <f:selectItem itemLabel="Without Reference" itemValue="noRef"/>
  <f:selectItem itemLabel="Reference" itemValue="ref"/>
  <f:ajax render="refBy" />
</h:selectOneMenu>
...
<h:selectOneMenu id="refBy" value="#{SalesCreate.orderBean.referenceBy}" disabled="#{SalesCreate.orderBean.createWith != 'ref'}">
  <f:selectItem itemLabel="Quotation" itemValue="quotation"/>
  <f:selectItem itemLabel="Contract" itemValue="contract"/>
</h:selectOneMenu>