Show multiple p:selectOneMenu inside ui:repeat based on selected value of previous menu

Question

I would like to display multiple <p:selectOneMenu> components inside <ui:repeat> based on the selected value of previous <f:selectItems> until leaf of the tree reached.

E.g. first list of countries in <p:selectOneMenu>. Now I select one country say Pakistan. Now inside <ui:repeat> there will be a second <p:selectOneMenu> component with cities of Pakistan. Now I select a city and then there should be a third <p:selectOneMenu> with sectors of city, and so on until no record is found from database.

How can I achieve this?

score 0 · Answer 1 · edited Jun 20 '20 at 09:12

The <ui:repeat> is insuitable for this. In first place, there isn't an infinite number of tables in the DB. Just conditionally render the descendant dropdown based on available select items from the DB table.

<p:selectOneMenu value="#{bean.country}">
    <f:selectItem itemValue="#{null}" itemLabel="--select country--" />
    <f:selectItems value="#{bean.countries}" />
    <p:ajax listener="#{bean.changeCountry}" update="cities" />
</p:selectOneMenu>
<h:panelGroup id="cities">
    <p:selectOneMenu value="#{bean.city}" rendered="#{not empty bean.cities}">
        <f:selectItem itemValue="#{null}" itemLabel="--select city--" />
        <f:selectItems value="#{bean.cities}" />
        <p:ajax listener="#{bean.changeCity}" update="sectors" />
    </p:selectOneMenu>
</h:panelGroup>
<h:panelGroup id="sectors">
    <p:selectOneMenu value="#{bean.sector}" rendered="#{not empty bean.sectors}">
        <f:selectItem itemValue="#{null}" itemLabel="--select sector--" />
        <f:selectItems value="#{bean.sectors}" />
    </p:selectOneMenu>
</h:panelGroup>

With something like this in a @ViewScoped bean:

private List<String> countries;
private String country;
private List<String> cities;
private String city;
private List<String> sectors;
private String sector;

@EJB
private LocationService locationService;

@PostConstruct
public void init() {
    countries = locationService.getCountries();
}

public void changeCountry() {
    cities = locationService.getCities(country);
    city = null;
    sectors = null;
}

public void changeCity() {
    sectors = locationService.getSectors(city);
    sector = null;
}

Of course, you can instead of String also use Country, City and Sector entities along with a (generic) converter.

Show multiple p:selectOneMenu inside ui:repeat based on selected value of previous menu

1 Answers1

See also: