Close

PrimeFaces - SelectCheckboxMenu With Ajax update Example

[Last Updated: Oct 5, 2017]

This example shows how to use SelectCheckboxMenu which is submitted on change event via Ajax.

JSF page

src/main/webapp/index.xhtml

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

    <h:form>
        <p:selectCheckboxMenu id="menu" value="#{itemsBean.selectedItems}" label="Items"
                              filter="true" filterMatchMode="contains">
            <f:selectItems value="#{itemsBean.items}"/>
            <p:ajax event="change" update="selectedItemText"/>
        </p:selectCheckboxMenu>
        <h:outputText id="selectedItemText" value=" #{itemsBean.selectedItems}"/>
    </h:form>
</h:body>

The managed bean

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

    @PostConstruct
    public void postInit() {
        items.addAll(Arrays.asList
                ("Watch", "Bottle", "Book", "Radio", "Monitor",
                        "Laptop", "Headphones", "TV", "Disk",
                        "Note Book", "Cell Phone"));
    }

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

    public void setSelectedItems(List<String> selectedItems) {
        this.selectedItems = selectedItems;
    }

    public List<String> getSelectedItems() {
        return selectedItems;
    }
}

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 SelectCheckboxMenu with Ajax Example Select All Download
  • select-checkbox-menu-example
    • src
      • main
        • java
          • com
            • logicbig
              • example
        • webapp
          • index.xhtml

    See Also