Primefaces Selectcheckboxmenu

by Online Tutorials Library July 14, 2022

PrimeFaces SelectCheckboxMenu

It is used to choose multiple items displayed in an overlay. We can create it by using <p:selectCheckboxMenu> component. It displays options in an overlay. It provides attribute that are tabled below.

SelectCheckboxMenu Attributes

Attribute	Default value	Return type	Description
id	null	String	It is an unique identifier of the component.
rendered	true	Boolean	It is used to render the specify component.
binding	null	Object	It binds an expression that maps to a server side UIComponent instance in a backing bean.
value	null	Object	It is used to set value of the component.
converter	null	Converter/String	It is used to define a converter for the component.
required	false	Boolean	It is used to mark component as required.
requiredMessage	null	String	It is used to set a message to be displayed when required field validation fails.
style	null	String	It is used to set inline style of the component.
onShow	null	String	It is a method that executes when overlay is displayed.
onHide	null	String	It is a method that executes when overlay is hidden.
multiple	false	Boolean	It is used to set selected itemds as multiple labels.

Ajax Behavior Events

SelectCeckboxMenu provides an Ajax event in addition to common dom events like change, selectCheckboxMenu.

Event	Listener Parameter	Executed
toggleSelect	org.primefaces.event.ToggleSelectEvent	When toggle all checkbox changes.

Example

Here, in the following example, we are implementing <p:selectCheckboxMenu> component. This example contains the following files.

JSF File

// calendar.xhtml

  <?xml version=’1.0′ encoding=’UTF-8′ ?>  <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN””http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>  <html xmlns=”http://www.w3.org/1999/xhtml”  xmlns:h=”http://xmlns.jcp.org/jsf/html”  xmlns:p=”http://primefaces.org/ui”  xmlns:f=”http://xmlns.jcp.org/jsf/core”>  <h:head>  <title>Checkbox Menu</title>  </h:head>  <h:body>  <h:form>  <h:panelGrid columns=”2″ cellpadding=”5″>  <h:outputLabel for=”menu” value=”Select Cities: ” />  <p:selectCheckboxMenu id=”menu” value=”#{checkboxMenu.selectedCities}” label=”Cities”  filter=”true” filterMatchMode=”startsWith” panelStyle=”width:250px”>  <f:selectItems value=”#{checkboxMenu.cities}” />  </p:selectCheckboxMenu>  </h:panelGrid>  </h:form>  </h:body>  </html>  

ManagedBean

// CheckboxMenu.java

  package com.tutoraspire;  import java.util.ArrayList;  import java.util.List;  import javax.annotation.PostConstruct;  import javax.faces.bean.ManagedBean;  @ManagedBean  public class CheckboxMenu {  private String[] selectedCities;  private List<String> cities;  @PostConstruct  public void init() {  cities = new ArrayList<>();  cities.add(“Greater Noida”);  cities.add(“New Delhi”);  cities.add(“Paris”);  cities.add(“Tokyo”);  cities.add(“Newyork”);  cities.add(“Moscow”);  cities.add(“Rome”);  cities.add(“California”);  cities.add(“Shanghai”);  }  public String[] getSelectedCities() {  return selectedCities;  }  public void setSelectedCities(String[] selectedCities) {  this.selectedCities = selectedCities;  }  public List<String> getCities() {  return cities;  }  }  

This JSF application produces the following output.

Output:

Primefaces Selectceckboxmenu 1

We can see that it allows us to select multiple items from the menu.

Next TopicPrimeFaces Editor