JSF2.0 タグ一覧 (f:selectItem, h:selectOneListbox) 編

テーマ：
これまで HTML (UIComponent) 系タグの一部を紹介してきましたが、JSF のタグにはバリデーション (入力チェック) やリソースファイルの読み込み、フォーマット変換等、JSF 固有機能を提供するタグも存在します。
これらのタグを単独で使用することは少ないため、次項では HTML (UIComponent) 系タグと組み合わせて記述例をあげたいと思います。
また、リストボックスやチェックボックス等の HTML 系タグも併せて紹介します。

2. JSF 固有機能系タグ

JSF の固有機能を定義するためのタグです。「f:xxx」と定義されることが一般的なようです。

XHTML では
　　<anyxmlelement xmlns:f="http://java.sun.com/jsf/core" />
JSP では
　　<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
と定義します。

(*) JSF 固有機能系タグの詳細はこちらをご参照ください。

2.1. f:selectItem / h:selectOneListbox / h:selectManyListbox

f:selectItem タグはリストボックスやチェックボックス等に含まれる項目 (Item) を定義します。
単独で使用しても何も出力されませんが、他の HTML 系タグと組み合わせることで <option> タグ等として出力されます。

また、h:selectOneListbox は HTML の <select> タグに対応しています。
これら二つを組み合わせることでリストボックスを出力することが可能となります。

sample2_1.xhtml
<h:body>
    <h:form id="sample">
        <h:selectOneListbox>
            <f:selectItem itemValue="book_001" itemLabel="小説"/>
            <f:selectItem itemValue="book_002" itemLabel="技術本"/>
            <f:selectItem itemValue="book_003" itemLabel="雑誌"/>
        </h:selectOneListbox>
    </h:form>
</h:body>

画面
赤び～の備忘録-20100712_01_JSF1

HTML
<body>
<form id="sample" name="sample" method="post"
      action="/glassfish/faces/sample/sample2_1.xhtml"
      enctype="application/x-www-form-urlencoded">

        <input type="hidden" name="sample" value="sample" />
        <select name="sample:j_id-1631015111_613750af" size="3">
            <option value="book_001">小説</option>
	    <option value="book_002">技術本</option>
	    <option value="book_003">雑誌</option>
        </select>
        <input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="2485459046956495775:3564858951512028665" />
</form>
</body>
(*) 一部改行を追加しています。
(*) エスケープ文字は日本語に変換しています。

f:selectItem は <option> に変換され、指定した itemValue 属性が value 属性として、指定した itemLabel 属性が <option> の値として設定されます。
itemValue 属性のみを指定した場合は、<option> の値も同値となります。

また、h:selectOneListbox は <select> に変換され、name 属性と size 属性 が設定されます。
size 属性のデフォルト値は f:selectItem タグ数となりますが、size 属性を指定することで初期値を指定可能です。
name 属性のデフォルト値は h:form の id 属性 (上記例では「sample」) + 謎の文字列となっていますが、id 属性を指定するとその値を優先します。
さらに value 属性を指定することでリストボックスの初期値を指定可能です。

ex.) <h:selectOneListbox id="book" size="5" value="book_002"/> での HTML と画面
<select id="sample:book" name="sample:book" size="5">
    <option value="book_001">小説</option>
    <option value="book_002" selected="selected">技術本</option>
    <option value="book_003">雑誌</option>
</select>

赤び～の備忘録-20100712_02_JSF2

2.2. h:selectManyListbox

h:selectManyListbox は HTML の <select multiple> タグ (複数選択可能なリストボックス) に対応しています。
詳細は h:selectOneListbox と同様になります。

ex.) <h:selectManyListbox id="book" size="5"/> での HTML と画面
<select id="sample:book" name="sample:book" multiple="multiple" size="5">
    <option value="book_001">小説</option>
    <option value="book_002">技術本</option>
    <option value="book_003">雑誌</option>
</select>

赤び～の備忘録-20100712_03_JSF3
(*) 複数選択可能

また、value 属性の定義を value="#{[Bean名].[プロパティ名]}" とすることで、管理対象 Bean と紐付けることが可能です。

h:selectManyListbox のように複数の値 (初期値) を管理対象 Bean で設定したい場合は、該当プロパティで java.util.List 型 を復帰してください。

ex.) 初期値を Bean で指定した場合の h:selectManyListbox 定義
<h:selectManyListbox value="#{itemList.selectedItems}">
    ～ 略 ～
</h:selectManyListbox>

ex.) 初期値を定義する Bean
@ManagedBean
public class ItemList {
    public List<String> getSelectedItems() {
        ArrayList<String> selectedItems = new ArrayList<String> ();
        selectedItems.add("book_002");
        selectedItems.add("book_003");

        return selectedItems;
    }
}
(*) 必要部分のみ抜粋

@see
「JSF2.0 画面 (XHTML) とビジネスモデル (ManagedBean) の連携 編」－「1.1. value 属性」

[ END ]