Combo box for the locations with Rich Faces and JSF

Version 2

    I share a simple mode to manage the nations, regions and city in a simple mode through the combo box. In this example we have two combo box, one for the region and one for the city. If I choose a region ,the city is automatically updated. Here the step:

     

    1 - download RichFaces from http://labs.jboss.com/downloading/?projectId=jbossrichfaces&url=http://download.jboss.com/jboss-richfaces/richfaces-ui-3.3.2.SR1-bin.zip

     

    2 - unpackage the three jars (richfaces-api-3.3.2.SR1.jar,richfaces-impl-3.3.2.SR1.jar and richfaces-ui-3.3.2.SR1.jar) inside the bin in your WEB-INF/lib

     

    3 - Write a pojo that takes the localities from a DB with some methods returning a Maps as:

    package it.my.portal.identity

    public class MyMetaDataServiceBean {
    .....
         public Map<String, String> getRegionsStr() {
              return regionsStr;
         }

         public Map<String, String> getCitiesStr() {
              return citiesStr;
         }

         public void updateCity(javax.faces.event.ValueChangeEvent event) {
              String codRegion = (String) event.getNewValue();
              updateCity(codRegion);
         }

         public void updateCity(String codRegion) {
              citiesStr.clear();
              for (Map.Entry<City, String> e : mappingCityRegion.entrySet()) {
                   City city = e.getKey();
                   String region = e.getValue();
                   if (region.equals(codRegion))
                        citiesStr.put(city.getCodCity(), city.getDescCity());
              }
         }
    ......

    4 - declare the pojo in your faces-config.xml inside WEB-INF:

     

    ......
         <managed-bean>
              <managed-bean-name>regionservice</managed-bean-name>
              <managed-bean-class>it.my.portal.identity.MyMetaDataServiceBean</managed-bean-class>
              <managed-bean-scope>application</managed-bean-scope>
         </managed-bean>
    ......

    5 - add in your page the combobox:

     

    <div
       xmlns="http://www.w3.org/1999/xhtml"
       xmlns:h="http://java.sun.com/jsf/html"
       xmlns:f="http://java.sun.com/jsf/core"
       xmlns:a4j="http://richfaces.org/a4j"
       class="identity-ui">
    .......
    <h:form>
           <h:selectOneMenu id="region" required="true" valueChangeListener="#{regionservice.updateCities}">
              <f:selectItems value="#{regionservice.regionsStr}" />
              <a4j:support event="onchange" reRender="city" />
         </h:selectOneMenu>

           <h:selectOneMenu id="city" required="true">
              <f:selectItems value="#{regionservice.citiesStr}" />
         </h:selectOneMenu>
    </h:form>
    ......
    </div>

    <a4j:support> tag executes a ajax call and it redirects the "city" value in the next combobox without refresh the page