Ajax Framework - Dropdown Dependent dropdowns implemented with p:ajax behavior.
Select a Location
  • Select Country
  • USA
  • Brazil
  • Germany
  • Select City

<h:form>
    <p:growl id="msgs" showDetail="true" />

    <p:panel header="Select a Location" style="margin-bottom:10px;">
        <h:panelGrid columns="2" cellpadding="5">
            <p:outputLabel for="country" value="Country: " />
            <p:selectOneMenu id="country" value="#{dropdownView.country}" style="width:150px">
                <p:ajax listener="#{dropdownView.onCountryChange}" update="city" />
                <f:selectItem itemLabel="Select Country" itemValue="" noSelectionOption="true" />
                <f:selectItems value="#{dropdownView.countries}" />
            </p:selectOneMenu>

            <p:outputLabel for="city" value="City: " />
            <p:selectOneMenu id="city" value="#{dropdownView.city}" style="width:150px">
                <f:selectItem itemLabel="Select City" itemValue="" noSelectionOption="true" />
                <f:selectItems value="#{dropdownView.cities}" />
            </p:selectOneMenu>
        </h:panelGrid>

        <p:separator />

        <p:commandButton value="Submit" update="msgs" actionListener="#{dropdownView.displayLocation}" icon="ui-icon-check" />
    </p:panel>
</h:form>
                
PrimeTek, Copyright © 2015
All rights reserved.
Running PrimeFaces-6.1-SNAPSHOT on Mojarra-2.2.8.