JSF Primefaces selectonemenu page navigation

Question

I am developing a web application using JSF and Primefaces. I want o show the following menu and depending on the choosen option go to one page or another.

XHTML code:

<p:outputLabel for="car" value="Grouping: " />
        <p:selectOneMenu id="car" value="#{selectOneMenuView.car}">
            <f:selectItem itemLabel="Select One" itemValue="" />
            <f:selectItems value="#{selectOneMenuView.cars}" />
        </p:selectOneMenu>

Managed bean code:

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ManagedProperty;
import javax.faces.model.SelectItem;
import javax.faces.model.SelectItemGroup;


ManagedBean
public class SelectOneMenuView {

    private String console;

    private String car; 
    private List<SelectItem> cars;

    private String city; 
    private Map<String,String> cities = new HashMap<String, String>();

    private Theme theme;  
    private List<Theme> themes;

    @ManagedProperty("#{themeService}")
    private ThemeService service;

    @PostConstruct
    public void init() {
        //cars
        SelectItemGroup g1 = new SelectItemGroup("German Cars");
        g1.setSelectItems(new SelectItem[] {new SelectItem("BMW", "BMW"), new SelectItem("Mercedes", "Mercedes"), new SelectItem("Volkswagen", "Volkswagen")});

        SelectItemGroup g2 = new SelectItemGroup("American Cars");
        g2.setSelectItems(new SelectItem[] {new SelectItem("Chrysler", "Chrysler"), new SelectItem("GM", "GM"), new SelectItem("Ford", "Ford")});

        cars = new ArrayList<SelectItem>();
        cars.add(g1);
        cars.add(g2);

public String getCar() {
        return car;
    }

    public void setCar(String car) {
        this.car = car;
    }
 }

How can I do so that an user navigates to pageBMW.xhtml if he chooses the BMW option from the list or to pagemercedes.xhtml if he chooses the Mercedes option from the list?

Answer 1

I would append an AJAX on change event to the selectOneMenu which calls a method on your bean and redirects through it similar to a combination of the respective accepted answers of selectOneMenu ajax events (AJAX event) and Sending a redirect from inside an ajax listener method (redirect).

Answer 2

You might process the value of car via an AJAX call and redirect the response from your bean class.

<p:selectOneMenu id="car" value="#{selectOneMenuView.car}">
        <f:selectItem itemLabel="Select One" itemValue="" 
            noSelectionOption="true" />
        <f:selectItems value="#{selectOneMenuView.cars}" />
        <p:ajax listener="#{selectOneMenuView.someAction()"
            process="@this" partialSubmit="true" />
</p:selectOneMenu>

And within your bean class something like

  public void someAction() {
        String location = "page"+car+".xhtml";
        FacesContext.getCurrentInstance()
            .getExternalContext()
            .redirect(location)
        ;
    }
}