Selection tags permit a user to select one or more items from collections variously presented as lists, menus, radio buttons, etc. Selection tags must be within the scope of an h:form tag to have their values communicated to the server.

The images in the "Images" menu items show variations in the use of these tags. The index.xhtml page in the select example demonstrates their use.

The h:selectBooleanCheckbox tag represents a single checkbox that you can wire to a boolean bean property.

To display the checkbox below:

use this tag in your JSF page:

     <h:selectBooleanCheckbox value="#{form.contactMe}"/>
      

and back it with the bean property:

     private boolean contactMe;
     public void setContactMe(boolean newValue) { contactMe = newValue; }
     public boolean getContactMe() { return contactMe; }
      

h:selectManyCheckbox allows a user to select one or more of the checkboxes in a group, as in this example:

A group of selection options is specified within the body of h:selectManyCheckbox, either with one or more f:selectItem tags or one f:selectItems tag.

Note that selection options are specified by JSF Core tags, not JSF HTML tags.

The checkboxes above could have been generated by:

     <h:selectManyCheckbox value="#{form.colors}">
        <f:selectItem itemValue="Red" itemLabel="Red"/>
        <f:selectItem itemValue="Blue" itemLabel="Blue"/>
        <f:selectItem itemValue="Yellow" itemLabel="Yellow"/>
        <f:selectItem itemValue="Green" itemLabel="Green"/>
        <f:selectItem itemValue="Orange" itemLabel="Orange"/>
     </h:selectManyCheckbox>
      

Note:

• The selected items are gathered and made to be the value of the bean property specified in the h:selectManyCheckbox's value attribute (in this case form.colors)
• This bean property must be a subtype of java.lang.Object[]
• In this case the values selected (given by the itemValue attributes) happen to be the same as the item labels (given by the itemLabel attributes), but they need not be

Only one selection can be made from a group of radio buttons:

These could be displayed with:

     <h:selectOneRadio value="#{form.education}">
        <f:selectItem itemValue="High School" itemLabel="High School"/>
        <f:selectItem itemValue="Bachelor's" itemLabel="Bachelor's"/>
        <f:selectItem itemValue="Master's" itemLabel="Master's"/>
        <f:selectItem itemValue="Doctorate" itemLabel="Doctorate"/>
     </h:selectOneRadio>
      

Note that the bean property receiving the selection (in this case form.education) should be a non-array type.

h:selectOneListbox and h:selectManyListbox are used to select one or many items from a list that may or may not render with a scrollbar:

Component	JSF Tag To Render It
	<h:selectOneListbox value="#{form.year}" size="5"> <f:selectItem itemValue="1900" itemLabel="1900"/> <f:selectItem itemValue="1901" itemLabel="1901"/> ... </h:selectOneListbox>
	<h:selectManyListbox value="#{form.languages}"> <f:selectItem itemValue="English" itemLabel="English"/> <f:selectItem itemValue="French" itemLabel="French"/> <f:selectItem itemValue="Italian" itemLabel="Italian"/> <f:selectItem itemValue="Spanish" itemLabel="Spanish"/> <f:selectItem itemValue="Russian" itemLabel="Russian"/> </h:selectManyListbox>

h:selectOneMenu and h:selectManyMenu render drop-down menus that present as buttons, for example:

Component

JSF Tag To Render It

<h:selectOneMenu value="#{form.day}"> <f:selectItem itemValue="1" itemLabel="Sunday"/> <f:selectItem itemValue="2" itemLabel="Monday"/> <f:selectItem itemValue="3" itemLabel="Tuesday"/> <f:selectItem itemValue="4" itemLabel="Wednesday"/> <f:selectItem itemValue="5" itemLabel="Thursday"/> <f:selectItem itemValue="6" itemLabel="Friday"/> <f:selectItem itemValue="7" itemLabel="Saturday"/> </h:selectOneMenu>

Note:

• The item values and item labels are different in this case, though they are both strings
• It is possible for item values to be other data types
• Browsers inconsistently render multiple-select HTML menus (such as those called for by h:selectManyMenu), leading to tiny scrollbars that are nearly impossible to manipulate (Internet Explorer) or no scrollbar at all, leaving you to navigate with arrow keys (Firefox).

Using f:selectItem for specifying more than a few selection items can be tedious, and it can expose details of the webapp's model in page markup.

f:selectItems is often a better approach.

Consider a selection list rendered with:

     <h:selectManyList value="#{form.condiments}">
        <f:selectItem itemValue="1" itemLabel="Cheese"/>
        <f:selectItem itemValue="2" itemLabel="Pickle"/>
        <f:selectItem itemValue="3" itemLabel="Mustard"/>
        <f:selectItem itemValue="4" itemLabel="Lettuce"/>
        <f:selectItem itemValue="5" itemLabel="Onions"/>
     </h:selectManyList>
      

If the form bean provides an appropriate condimentItems property, the above can be replaced by:

     <h:selectManyList value="#{form.condiments}">
        <f:selectItems value="#{form.condimentItems}"/>
     </h:selectManyList>
      

The bean property behind a f:selectItems tag is usually an array, collection, or map.

The simplest approach is to use an array of SelectItems (package javax.faces.model):

     private static SelectItem[] condimentItems = {
        new SelectItem(1, "Cheese"),  // value, label
        new SelectItem(2, "Pickle"),
        new SelectItem(3, "Mustard"),
        new SelectItem(4, "Lettuce"),
        new SelectItem(5, "Onions")
     };

     public SelectItem[] getCondimentItems() {
        return condimentItems;
     }
      

Be aware that for browsers, values are always strings.

So in the above example, when a user selects a condiment, say mustard, the string "3" will be sent in the request.

In this case JSF will convert the string "3" to the integer 3, but for any type other than int, Integer, or enum, you will have to supply a converter (see chapter 7).