選擇類標籤（一）

在視圖上呈現一個核取方塊，例如：

 我同意 <h:selectBooleanCheckbox value="#{user.aggree}"/>

 
value所綁定的屬性必須接受與傳回boolean型態。這個元件在網頁上呈現的外觀如下：

這三個標籤的作用，是讓使用者從其所提供的選項中選擇一個項目，所不同的就是其外觀上的差別，例如：

 <h:selectOneRadio value="#{user.education}">
   <f:selectItem itemLabel="高中" itemValue="高中"/>
   <f:selectItem itemLabel="大學" itemValue="大學"/>
   <f:selectItem itemLabel="研究所以上" itemValue="研究所以上"/>
 </h:selectOneRadio><p>

value所綁定的屬性可以接受字串以外的型態或是自訂型態，但記得如果是必須轉換的型態或自訂型態，必須搭配 標準轉換器 或 自訂轉換器 來轉換為物件，<h:selectOneRadio>的外觀如下：

您也可以設定layout屬性，可設定的屬性是lineDirection、pageDirection，預設是lineDirection，也就是由左到右來排列選項，如果設定為pageDirection，則是由上至下排列選項，例如設定為：

 <h:selectOneRadio layout="pageDirection"
                   value="#{user.education}">
   <f:selectItem itemLabel="高中" itemValue="高中"/>
   <f:selectItem itemLabel="大學" itemValue="大學"/>
   <f:selectItem itemLabel="研究所以上" itemValue="研究所以上"/>
 </h:selectOneRadio><p>

則外觀如下：

<h:selectOneListbox>、<h: selectOneMenu>的設定方法類似於<h: selectOneRadio>，以下分別列出<h:selectOneListbox>、<h: selectOneMenu>的外觀：

這三個標籤提供使用者複選項目的功能，一個<h:selectManyCheckbox>例子如下：

 <h:selectManyCheckbox layout="pageDirection"
                       value="#{user.preferColors}">
     <f:selectItem itemLabel="紅" itemValue="false"/>
     <f:selectItem itemLabel="黃" itemValue="false"/>
     <f:selectItem itemLabel="藍" itemValue="false"/>
 </h:selectManyCheckbox><p>  

value所綁定的屬性必須是陣列或集合（Collection）物件，在這個例子中所使用的是boolean陣列，例如：

 package onlyfun.caterpillar;

 public class UserBean {
    private boolean[] preferColors;

    public boolean[] getPreferColors() {
        return preferColors;
    }

    public void setPreferColors(boolean[] preferColors) {
        this.preferColors = preferColors;
    }

    ......
 }

如果是其它型態的物件，必要時必須搭配轉換器（Converter）進行字串與物件之間的轉換。

下圖是<h:selectManyCheckbox>的外觀，這是將layout設定為pageDirection的外觀：

<h:selectManyListbox>的設定方法類似，其外觀如下：

<h:selectManyMenu>在不同的瀏覽器中會有不同的外觀，在Mozilla Firefox中是這樣的：

在Internet Explorer則是這樣的：