PrimeFaces - SelectOneMenu With Ajax update Example

[Updated: Aug 4, 2017, Created: Aug 4, 2017]

This example shows how to use SelectOneMenu which is submitted on selection event via Ajax.

JSF page

src/main/webapp/index.xhtml

<h:body style="margin-left:30px">
    <h3>PrimeFaces SelectOneMenu With Ajax Example</h3>

    <h:form>
        <p:outputLabel for="menu"/>
        <br/>
        <p:selectOneMenu id="menu" value="#{itemsBean.selectedItem}">
            <f:selectItem itemLabel="Select One Item"/>
            <f:selectItems value="#{itemsBean.items}"/>
            <p:ajax event="itemSelect" update=":selectedItemText"/>
        </p:selectOneMenu>
    </h:form>
    <br/>

    <h:outputText id="selectedItemText" value="#{itemsBean.selectedItem}"/>
</h:body>

The managed bean

@ManagedBean
@ViewScoped
public class ItemsBean {
  private List<String> items = new ArrayList<>();
  private String selectedItem;

  @PostConstruct
  public void postInit() {
      items.add("Watch");
      items.add("Bottle");
      items.add("Book");
      items.add("Radio");
  }

  public String getSelectedItem() {
      return selectedItem;
  }

  public void setSelectedItem(String selectedItem) {
      this.selectedItem = selectedItem;
  }

  public List<String> getItems() {
      return items;
  }
}

To try examples, run embedded tomcat (configured in pom.xml of example project below):

mvn tomcat7:run-war

Output

Example Project

Dependencies and Technologies Used :

  • primefaces 6.1 primefaces
  • jsf-api 2.2.14: This is the master POM file for Oracle's Implementation of the JSF 2.2 Specification.
  • jsf-impl 2.2.14: This is the master POM file for Oracle's Implementation of the JSF 2.2 Specification.
  • JDK 1.8
  • Maven 3.3.9

PrimeFaces SelectOneMenu with Ajax Example Select All Download
  • select-one-menu-with-ajax
    • src
      • main
        • java
          • com
            • logicbig
              • example
        • webapp

See Also