JSF html標簽
命令類標簽包括commandButton與commandLink
其主要作用在于提供一個命令按鈕或鏈接，以下舉例說明：
顯示一個命令按鈕，即輸出<input> HTML標簽，其type屬性可以設定為button、submit或reset，默認是submit，按下按鈕會觸發 javax.faces.event.ActionEvent，使用例子如下：
<h:commandButton value="送出" action="#{user.verify}"/>
您可以設定image屬性，指定圖片的URL，設定了image屬性的話，<input>標簽的type屬性會被設定為image，例如：
<h:commandButton value="#{msgs.commandText}"
image="images/logowiki.jpg"
action="#{user.verify}"/>
產生超鏈接，會輸出<a> HTML標簽，而href屬性會有'#'，而onclick屬性會含有一段JavaScript程序，這個JavaScript的目的是按下鏈接后自動提交窗體，具體來說其作用就像按鈕，但外觀卻是超鏈接，包括在本體部份的內容都會成為超鏈接的一部份，一個使用的例子如下：
<h:commandLink value="#{msgs.commandText}"
action="#{user.verify}"/>
產生的HTML輸出范例如下：
<a href="#" onclick="document.forms['_id3']['_id3:_idcl'].value='_id3:_id13'; document.forms['_id3'].submit(); return false;">Submit</a>
如果搭配<f:param>來使用，則所設定的參數會被當作請求參數一并送出，例如：
<h:commandLink>
<h:outputText value="welcome"/>
<f:param name="locale" value="zh_TW"/>
</h:commandLink>
選擇類的標簽可略分為單選標簽與多選標簽，依外型的不同可以分為單選鈕（Radio）、復選框（CheckBox）、列示方塊（ListBox）與選單（Menu）
以下分別先作簡單的說明:
- <h:selectBooleanCheckbox>
在視圖上呈現一個復選框，例如：
我同意 <h:selectBooleanCheckbox value="#{user.aggree}"/>
value所綁定的屬性必須接受與傳回boolean型態。
產生的html代碼：
我同意<INPUT TYPE="checkbox" />
- <h:selectOneRadio>、<h:selectOneListbox>、<h: selectOneMenu>
這三個標簽的作用，是讓使用者從其所提供的選項中選擇一個項目，所不同的就是其外觀上的差別，例如：
<h:selectOneRadio value="#{user.education}">
<f:selectItem itemLabel="高中" itemValue="高中"/>
<f:selectItem itemLabel="大學" itemValue="大學"/>
<f:selectItem itemLabel="研究所以上" itemValue="研究所以上"/>
</h:selectOneRadio><p>
value所綁定的屬性可以接受字符串以外的型態或是自定義型態，但記得如果是必須轉換的型態或自定義型態，必須搭配 標準轉換器 或 自定義轉換器 來轉換為對象，<h:selectOneRadio>
產生的html代碼：
高中<INPUT TYPE="radio" NAME="1" value="高中"/>
大學<INPUT TYPE="radio" NAME="1" value="大學"/>
研究所以上<INPUT TYPE="radio" NAME="1" value="研究所以上">
您也可以設定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:selectManyCheckbox>、<h:selectManyListbox>、<h: selectManyMenu>
這三個標簽提供用戶復選項目的功能，一個<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:selectManyListbox>的設定方法類似
選擇類標簽可以搭配<f:selectItem>或<f:selectItems>標簽來設定選項，例如：
<f:selectItem itemLabel="高中"
itemValue="高中"
itemDescription="學歷"
itemDisabled="true"/>
itemLabel屬性設定顯示在網頁上的文字，itemValue設定發送至服務器端時的值，itemDescription 設定文字描述，它只作用于一些工具程序，對HTML沒有什么影響，itemDisabled設定是否選項是否作用，這些屬性也都可以使用JSF Expression Language來綁定至一個值。
<f:selectItem>也可以使用value來綁定一個傳回javax.faces.model.SelectItem的方法，例如：
<f:selectItem value="#{user.sex}"/>
則綁定的Bean上必須提供下面這個方法：
....
public SelectItem getSex() {
return new SelectItem("男");
}
....
如果要一次提供多個選項，則可以使用<f:selectItems>，它的value綁定至一個提供傳回SelectItem?的數組、集合，或者是Map對象的方法，例如：
<h:selectOneRadio value="#{user.education}">
<f:selectItems value="#{user.educationItems}"/>
</h:selectOneRadio><p>
這個例子中<f:selectItems>的value綁定至user.educationItems，其內容如下：
....
private SelectItem[] educationItems;
public SelectItem[] getEducationItems() {
if(educationItems == null) {
educationItems = new SelectItem[3];
educationItems[0] =
new SelectItem("高中", "高中");
educationItems[1] =
new SelectItem("大學", "大學");
educationItems[2] =
new SelectItem("研究所以上", "研究所以上");
}
return educationItems;
}
....
在這個例子中，SelectItem的第一個構造參數用以設定value，而第二個參數用以設定label，SelectItem還提供有數個構造函式，記得可以參考一下線上API文件。
您也可以提供一個傳回Map對象的方法，Map的key-value會分別作為選項的label-value，例如：
<h:selectManyCheckbox layout="pageDirection"
value="#{user.preferColors}">
<f:selectItems value="#{user.preferColorItems}"/>
</h:selectManyCheckbox><p>
您要提供下面的程序來搭配上面這個例子：
....
private Map preferColorItems;
public Map getPreferColorItems() {
if(preferColorItems == null) {
preferColorItems = new HashMap();
preferColorItems.put("紅", "Red");
preferColorItems.put("黃", "Yellow");
preferColorItems.put("藍", "Blue");
}
return preferColorItems;
}