The Seasar Project

ポストバック用のフォームを使うには

ポストバック 用のフォームは， <form> 要素に id 属性を付け， 値を form または Form で終わるようにします．

action 属性および method 属性， name 属性はレンダリング時に付加されます (テンプレートに記述されていても無視されます)．

例：テンプレートHTML (foo.html)

<form id="form">
  ...
</form>

例：レンダリング結果

レンダリング結果は次のようになります．

<form id="form" name="form" method="post" action="/context/view/subapp/foo.html">
  ...
</form>

テキストフィールドを使うには

type 属性が text の <input> 要素を記述して id 属性を付け， その値と同じ名前のプロパティをページクラスに用意します．

レンダリング時， <input> 要素の value 属性にプロパティの値が設定されます． プロパティの値が '<' や '>' 等を含む場合はエスケープされます．

ポストバック 時，ブラウザで入力された値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="text" id="name" />

例：ページクラスのプロパティ (FooPage.java)

public String name;

例：レンダリング結果

name プロパティの値が "Teeda" の場合， レンダリング結果は次のようになります．

<input type="text" id="name" name="form:name" value="Teeda" />

テキストフィールドに "Seasar" と入力してサブミットすると， ページクラスの name プロパティには "Seasar" が設定されます．

数値の入力を支援するには

<input> 要素の class 属性に "T_currency" を含めます．

テキストフィールドに入力できるのは数字と符号 ( '-' )，小数点 ( '.' )，カンマ ( ',' ) に限定されます． 数字の後に 't' ， 'm' ， 'b' キーを押すと，入力済みの数がそれぞれ 1,000 倍，1,000,000 倍， 1,000,000,000 倍されます．

不正なキーが押されるとテキストフィールドはクリアされます．

フォーカスが外れると入力した数はカンマ区切りになります．

例：テンプレートHTML (foo.html)

<input type="text" id="saraly" class="T_currency" />

例：ページクラスのプロパティ (FooPage.java)

public BigDecimal saraly;

例：レンダリング結果

<input type="text" id="salary" name="form:salary" class="T_currency" 
    onfocus="..." onblur="..." onkeydown="..." style="ime-mode:disabled;" />

日付の入力を支援するには

<input> 要素の class 属性に "T_date" を含めます．

テキストフィールドに入力できるのは数字とスラッシュ ( '/' ) に限定されます．

年は二桁で入力することができます． フォーカスが外れると年は4桁に変換され， スラッシュ区切りになります．

例：テンプレートHTML (foo.html)

<input type="text" id="date" class="T_date" />

例：ページクラスのプロパティ (FooPage.java)

@DateTimeConverter(pattern = "yyyy/MM")
public Date date;

例：レンダリング結果

<input type="text" id="date" name="form:date" class="T_date" 
    onfocus="..." onblur="..." onkeydown="..." style="ime-mode:disabled;" />

パスワードフィールドを使うには

type 属性が password の <input> 要素を記述して id 属性を付け， その値と同じ名前のプロパティをページクラスに用意します．

レンダリング時， <input> 要素の value 属性に値は設定されません．

ポストバック 時，ブラウザで入力された値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="password" id="pwd" />

例：ページクラスのプロパティ (FooPage.java)

public String pwd;

例：レンダリング結果

<input type="password" id="pwd" name="form:pwd" />

パスワードフィールドに "1234" と入力してサブミットすると， ページクラスの pwd プロパティには "1234" が設定されます．

パスワードフィールドに初期値を表示するには

type 属性が password の <input> 要素に te:redisplay 属性を付け， その値に true を指定します．

レンダリング時， <input> 要素の value 属性にプロパティの値が設定されます． プロパティの値が '<' や '>' 等を含む場合はエスケープされます．

ポストバック 時，ブラウザで入力された値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="password" id="pwd" te:redisplay="true" />

例：ページクラスのプロパティ (FooPage.java)

public String pwd;

例：レンダリング結果

pwd プロパティの値が "hoge" の場合， レンダリング結果は次のようになります．

<input type="password" id="pwd" name="form:pwd" value="hoge" />

テキストエリアを使うには

<textarea> 要素を記述して id 属性を付け， その値と同じ名前のプロパティをページクラスに用意します．

レンダリング時， <textarea> 要素の内容にはプロパティの値が設定されます． プロパティの値が '<' や '>' 等を含む場合はエスケープされます．

ポストバック 時，ブラウザで入力された値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<textarea id="name">dummy</textarea>

例：ページクラスのプロパティ (FooPage.java)

public String name;

例：レンダリング結果

name プロパティの値が "Teeda" の場合， レンダリング結果は次のようになります．

<textarea id="name" name="form:name">Teeda</textarea>

テキストエリアに "Seasar" と入力してサブミットすると， ページクラスの name プロパティには "Seasar" が設定されます．

静的なラジオボタンを使うには

<span> 要素または <div> 要素に id 属性を付け， その値と同じ名前のプロパティをページクラスに用意します． このプロパティは選択された項目の値を保持します．

<span> 要素または <div> 要素の内容に type 属性が radio の <input> 要素を記述して，その name 属性に <span> 要素または <div> 要素の id 属性と同じ値を指定します． 同じ name 属性を持つ <input type="radio"> 要素を複数記述することができます．

ポストバック 時，ブラウザで選択されたラジオボタンの value 属性の値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合はプロパティは設定されません．

例：テンプレートHTML (foo.html)

<div id="selected">
    <label><input type="radio" name="selected" value="A" />A</label>
    <label><input type="radio" name="selected" value="B" />B</label>
    <label><input type="radio" name="selected" value="C" />C</label>
</div>

例：ページクラスのプロパティ (FooPage.java)

public String selected;

例：レンダリング結果

<div id="selected">
    <label><input type="radio" name="form:selected" value="A" />A</label>
    <label><input type="radio" name="form:selected" value="B" />B</label>
    <label><input type="radio" name="form:selected" value="C" />C</label>
</div>

2番目のラジオボタン(B)を選択してサブミットすると， ページクラスの selected プロパティには "B" が設定されます．

静的なラジオボタンをチェックされた状態で表示するには

<span> 要素または <div> 要素の id 属性と同じ名前のプロパティに，チェックされた状態で表示したい <input> 要素の value 属性と同じ値を設定します．

レンダリング時， input 要素の value 属性の値が， <span> 要素または <div> 要素の id 属性と同じ名前のプロパティの値と一致する <input> 要素には， checked 属性が付け加えられます．

例：テンプレートHTML (foo.html)

<div id="selected">
    <label><input type="radio" name="selected" value="A" />A</label>
    <label><input type="radio" name="selected" value="B" />B</label>
    <label><input type="radio" name="selected" value="C" />C</label>
</div>

例：ページクラスのプロパティ (FooPage.java)

public String selected;

例：レンダリング結果

selected プロパティの値が "A" の場合， レンダリング結果は次のようになります．

<div id="selected">
    <label><input type="radio" name="form:selected" value="A" checked="checked" />A</label>
    <label><input type="radio" name="form:selected" value="B" />B</label>
    <label><input type="radio" name="form:selected" value="C" />C</label>
</div>

静的なラジオボタンの値を動的に変えるには

「 ダイナミックプロパティ 」と組み合わせます．

type 属性が radio の <input> 要素に id 属性を付け， その値に Value を加えた名前のプロパティをページクラスに用意します． このプロパティは項目の値を保持します．

レンダリング時， input 要素の value 属性の値は id + Value という名前のプロパティ値に置き換えられます．

例：テンプレートHTML (foo.html)

<div id="selected">
    <label>
        <input type="radio" id="code1" name="selected" value="dummy" />
        <span id="name1" te:omittag="true">dummy</span>
    </label>
    <label>
        <input type="radio" id="code2" name="selected" value="dummy" />
        <span id="name2" te:omittag="true">dummy</span>
    </label>
</div>

例：ページクラスのプロパティ (FooPage.java)

public String selected;
public String code1Value;
public String name1;
public String code2Value;
public String name2;

例：レンダリング結果

code1Value が "t" ， name1 が "Teeda" で， code2Value が "s" ， name2 が "SAStruts" の場合， レンダリング結果は次のようになります．

<div id="selected">
    <label>
        <input type="radio" id="code1" name="form:selected" value="t" />
        Teeda
    </label>
    <label>
        <input type="radio" id="code2" name="form:selected" value="s" />
        SAStruts
    </label>
</div>

1番目のラジオボタン(Teeda)を選択してサブミットすると， ページクラスの selected プロパティには "t" が設定されます．

静的なラジオボタンの数を動的に変えるには

forEach と組み合わせます．

<span> 要素または <div> 要素の内容に，forEach にマッピングされる ( id 属性が Items で終わる) 要素を記述します． その id 属性と同じ値を持つプロパティをページクラスに用意します． このプロパティの型は配列または java.util.List に，その要素の型はDtoまたは java.util.Map にします．

type 属性が radio の <input> 要素に id 属性を付けます．

input 要素の id + Value という名前を持つDtoのプロパティまたは Map のキーを用意します． Dtoのプロパティまたは Map のキーと同じ名前のプロパティをページクラスにも持たせます．

レンダリング時， input 要素の value 属性の値は id + Value という名前のプロパティ値に置き換えられます．

例：テンプレートHTML (foo.html)

<input type="hidden" id="productItemsSave" />
<div id="selected">
    <div id="productItems">
        <label>
            <input type="radio" id="code" name="selected" value="dummy" />
            <span id="name" te:omittag="true">dummy</span>
        </label>
    </div>
</div>

例：ページクラスのプロパティ (FooPage.java)

public String selected;
public List<ProductDto> productItems;
public String codeValue; //Teedaが設定
public String name; //Teedaが設定

例：Dtoのプロパティ (ProductDto.java)

public String codeValue;
public String name;

例：レンダリング結果

productItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<input type="hidden" id="form:productItemsSave" value="..." />
<div id="selected">
    
        <label>
            <input type="radio" id="form:productImtems:0:code" name="form:selected" value="t" />
            Teeda
        </label>
        <label>
            <input type="radio" id="form:productImtems:1:code" name="form:selected" value="s" />
            SAStruts
        </label>
        <label>
            <input type="radio" id="form:productImtems:2:code" name="form:selected" value="c" />
            Cubby
        </label>
    
</div>

1番目のラジオボタン(Teeda)を選択してサブミットすると， ページクラスの selected プロパティには "t" が設定されます．

関連項目

• forEach
• itemsSave

動的なラジオボタンを使うには

<span> 要素に id 属性を付けます． 要素の内容には， type 属性が radio で， <span> 要素の id 属性と同じ name 属性を持つ <input> 要素を記述します． この <input> 要素は実行時には捨てられます (ブラウザで直接プレビューする際のモックとして活用してください)．

ページクラスに2つのプロパティを用意します． 一つめは <span> 要素の id 属性と同じ名前で， 配列型のプロパティです． このプロパティは選択された項目の値を保持します．

二つめは <span> 要素の id 属性の値に Items を加えた名前で， 型は次のいずれかです．

• 配列または java.util.List
• java.util.Map

配列または List 型の場合は， その要素型はDtoまたは java.util.Map で， label および value というプロパティ ( Map の場合はキー) でラジオボタンのラベルと値を保持します． Map の場合は， label = value というマッピングでラベルと値を保持します (順序を維持するには java.util.LinkedHashMap を使います)．

レンダリング時， <span> 要素の内容は Items プロパティの要素の数分の <input> 要素に置き換えられます．

ポストバック 時，ブラウザで選択された項目の値が <span> 要素の id 属性と同じ名前のプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<span id="select">
    <input type="radio" name="select" /> Item1
    <input type="radio" name="select" /> Item2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selectItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<table id="select">
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="A" />AAAA</label>
        </td>
        <td>
            <label><input type="radio" name="form:select" value="B" />BBBB</label>
        </td>
        <td>
            <label><input type="radio" name="form:select" value="C" />CCCC</label>
        </td>
    </tr>
</table>

最初のラジオボタンを選択してサブミットすると， ページクラスの select プロパティには， "A" が設定されます．

動的なラジオボタンで1行に描画される数を指定するには

<span> 要素の te:col 属性に 1 行あたりのチェックボックスの数を指定します．

例：テンプレートHTML (foo.html)

<span id="select" te:col="2">
    <input type="radio" name="select" />Item1
    <input type="radio" name="select" />Item2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selectItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<table id="select">
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="A" />AAAA</label>
        </td>
        <td>
            <label><input type="radio" name="form:select" value="B" />BBBB</label>
        </td>
    </tr>
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="C" />CCCC</label>
        </td>
    </tr>
</table>

動的なラジオボタンを縦に並べるには

<span> 要素の te:layout 属性に pageDirection を指定します (デフォルトは lineDirection です)．

例：テンプレートHTML (foo.html)

<span id="select" te:layout="pageDirection">
    <input type="radio" name="select" />Item1
    <input type="radio" name="select" />Item2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selectItems;

例：レンダリング結果

optionItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<table id="select">
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="A" />AAAA</label>
        </td>
    </tr>
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="B" />BBBB</label>
        </td>
    </tr>
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="C" />CCCC</label>
        </td>
    </tr>
</table>

動的なラジオボタンでテーブルを使わずに描画するには

<span> 要素の te:layout 属性に none を指定します．

例：テンプレートHTML (foo.html)

<span id="select" te:layout="none">
    <input type="radio" name="select" />Option1
    <input type="radio" name="select" />Option2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selectItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<label><input type="radio" name="form:select" value="A" />AAAA</label>
<label><input type="radio" name="form:select" value="B" />BBBB</label>
<label><input type="radio" name="form:select" value="C" />CCCC</label>

動的なラジオボタンで選択されたラベルをポストバック時に受け取るには

ポストバック 時に， 選択された項目の値だけではなく， ラベルもプロパティで受け取るには， <span> 要素よりも 前 に， 隠しフィールド ( input 要素) を用意します． input 要素の id 属性は， <span> 要素の id 属性の値に ItemsSave を加えた名前を指定します．

ページクラスにラベルを受け取るプロパティを用意します． プロパティは <span> 要素の id 属性の値に Label を加えた名前で， 型は String とします．

ポストバック 時，ブラウザで選択された項目のラベルが <span> 要素の id 属性の値に Label を加えた名前のプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="hidden" id="selectItemsSave" />
<span id="select">
    <input type="radio" name="select" /> Item1
    <input type="radio" name="select" /> Item2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public String selectLabel;
public List<Map> selectItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<input type="hidden" id="selectItemsSave" name="form:selectItemsSave" value="..." />
<table id="select">
    <tr>
        <td>
            <label><input type="radio" name="form:select" value="A" />AAAA</label>
        </td>
        <td>
            <label><input type="radio" name="form:select" value="B" />BBBB</label>
        </td>
        <td>
            <label><input type="radio" name="form:select" value="C" />CCCC</label>
        </td>
    </tr>
</table>

最初のラジオボタンを選択してサブミットすると， ページクラスの selectLabel プロパティには， "AAAA" が設定されます．

単一項目のチェックボックスを使うには

type 属性が checkbox の <input> 要素を記述して id 属性を付け， その値と同じ名前で型が boolean のプロパティをページクラスに用意します．

レンダリング時， <input> 要素の value 属性にプロパティの値が設定されます．

ポストバック 時，ブラウザで選択された状態がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="checkbox" id="option" />

例：ページクラスのプロパティ (FooPage.java)

public boolean option;

例：レンダリング結果

<input type="checkbox" id="option" name="form:option" value="true" />

チェックボックスを選択してサブミットすると， ページクラスの option プロパティには true が設定されます．

単一項目のチェックボックスをチェックされた状態で表示するには

<input> 要素の id 属性と同じ名前のプロパティを true に設定します．

例：テンプレートHTML (foo.html)

<input type="checkbox" id="option" />

例：ページクラスのプロパティ (FooPage.java)

public boolean option;

例：レンダリング結果

option プロパティの値が true の場合， レンダリング結果は次のようになります．

<input type="checkbox" id="option" name="form:option" value="true" checked="checked" />

チェックボックスの選択を解除してサブミットすると， ページクラスの option プロパティには false が設定されます．

単一項目のチェックボックスを複数使うには

forEach と組み合わせます．

forEach にマッピングされる ( id 属性が Items で終わる) 要素を記述します． その id 属性と同じ値を持つプロパティをページクラスに用意します． このプロパティの型は配列または java.util.List に，その要素の型はDtoまたは java.util.Map にします． Dtoのプロパティまたは Map のキーと同じ名前のプロパティをページクラスにも持たせます．

type 属性が checkbox の <input> 要素に id 属性を付け， Dtoのプロパティまたは Map のキーと同じ名前を付けます．

レンダリング時， input 要素の value 属性の値は id 属性の値と同じ名前のプロパティに置き換えられます．

例：テンプレートHTML (foo.html)

<input type="hidden" id="optionItemsSave" />
<div id="optionItems">
    <label>
        <input type="checkbox" id="checked" value="dummy" />
        <span id="name" te:omittag="true">dummy</span>
    </label>
    <input type="hidden" id="name-2" value="dummy" />
</div>

例：ページクラスのプロパティ (FooPage.java)

public List<OptionDto> optionItems;
public boolean checked; //Teedaが設定
public String name;     //Teedaが設定

例：Dtoのプロパティ (OptionDto.java)

public boolean checked;
public String name;

例：レンダリング結果

optionItems が2つの要素を持つ場合， レンダリング結果は次のようになります．

<input type="hidden" id="form:optionItemsSave" value="..." />
    
    <label>
        <input type="checkbox" id="checked" name="form:optionItems:0:checked" value="true" />
        Teeda
    </label>
    <input type="hidden" id="name-2" name="form:optionItems:0:name-2" value="Teeda" />
    <label>
        <input type="checkbox" id="checked" name="form:optionItems:1:checked" value="true" />
        SAStruts
    </label>
    <input type="hidden" id="name-2" name="form:optionItems:1:name-2" value="SAStruts" />
    

1番目のチェックボックス(Teeda)を選択してサブミットすると， ページクラスの optionItems の最初の要素の option プロパティには true が，2番目の要素の option プロパティには false が設定されます．

関連項目

• forEach
• itemsSave

複数項目のチェックボックスを使うには

<span> 要素に id 属性を付けます． 要素の内容には， type 属性が checkbox で， <span> 要素の id 属性と同じ name 属性を持つ <input> 要素を記述します． この <input> 要素は実行時には捨てられます (ブラウザで直接プレビューする際のモックとして活用してください)．

ページクラスに2つのプロパティを用意します． 一つめは <span> 要素の id 属性と同じ名前で， 配列型のプロパティです． このプロパティは選択された項目の値を保持します．

二つめは <span> 要素の id 属性の値に Items を加えた名前で， 型は次のいずれかです．

• 配列または java.util.List
• java.util.Map

配列または List 型の場合は， その要素型はDtoまたは java.util.Map で， label および value というプロパティ ( Map の場合はキー) でラジオボタンのラベルと値を保持します． Map の場合は， label = value というマッピングでラベルと値を保持します (順序を維持するには java.util.LinkedHashMap を使います)．

レンダリング時， <span> 要素の内容は Items プロパティの要素の数分の <input> 要素に置き換えられます．

ポストバック 時，ブラウザで選択された項目の値が <span> 要素の id 属性と同じ名前のプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<span id="option">
    <input type="checkbox" name="option" /> Option1
    <input type="checkbox" name="option" /> Option2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String[] option;
public List<Map> optionItems;

例：レンダリング結果

optionItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<table id="option">
    <tr>
        <td>
            <label>
                <input type="checkbox" name="form:option" value="A" />
                AAAA
            </label>
        </td>
        <td>
            <label>
                <input type="checkbox" name="form:option" value="B" />
                BBBB
            </label>
        </td>
        <td>
            <label>
                <input type="checkbox" name="form:option" value="C" />
                CCCC
            </label>
        </td>
    </tr>
</table>

全てのチェックボックスを選択してサブミットすると， ページクラスの option プロパティには， "A" ， "B" ， "C" を要素とする配列が設定されます．

複数項目のチェックボックスで項目がチェックされた状態で表示するには

<input> 要素の id 属性と同じ名前のプロパティに， 選択状態にしたい項目の値を要素とする配列を設定します．

例：テンプレートHTML (foo.html)

<span id="option">
    <input type="checkbox" name="option" /> Option1
    <input type="checkbox" name="option" /> Option2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String[] option;
public List<Map> optionItems;

例：レンダリング結果

option プロパティに "A" と "C" を要素とする配列を設定すると， レンダリング結果は次のようになります．

<table id="option">
    <tr>
        <td>
            <label>
                <input type="checkbox" name="form:option" value="A" checked="checked" />
                AAAA
            </label>
        </td>
        <td>
            <label>
                <input type="checkbox" name="form:option" value="B" />
                BBBB
            </label>
        </td>
        <td>
            <label>
                <input type="checkbox" name="form:option" value="C" checked="checked" />
                CCCC
            </label>
        </td>
    </tr>
</table>

複数項目のチェックボックスで1行に描画される数を指定するには

<span> 要素の te:col 属性に 1 行あたりのチェックボックスの数を指定します．

例：テンプレートHTML (foo.html)

<span id="option" te:col="2">
    <input type="checkbox" name="option" /> Option1
    <input type="checkbox" name="option" /> Option2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String[] option;
public List<Map> optionItems;

例：レンダリング結果

optionItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<table id="option">
    <tr>
        <td>
            <label><input type="checkbox" name="form:option" value="A" />AAAA</label>
        </td>
        <td>
            <label><input type="checkbox" name="form:option" value="B" />BBBB</label>
        </td>
    </tr>
    <tr>
        <td>
            <label><input type="checkbox" name="form:option" value="C" />CCCC</label>
        </td>
    </tr>
</table>

複数項目のチェックボックスを縦に並べるには

<span> 要素の te:layout 属性に pageDirection を指定します (デフォルトは lineDirection です)．

例：テンプレートHTML (foo.html)

<span id="option" te:layout="pageDirection">
    <input type="checkbox" name="option" /> Option1
    <input type="checkbox" name="option" /> Option2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String[] option;
public List<Map> optionItems;

例：レンダリング結果

optionItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<table id="option">
    <tr>
        <td>
            <label><input type="checkbox" name="form:option" value="A" />AAAA</label>
        </td>
    </tr>
    <tr>
        <td>
            <label><input type="checkbox" name="form:option" value="B" />BBBB</label>
        </td>
    </tr>
    <tr>
        <td>
            <label><input type="checkbox" name="form:option" value="C" />CCCC</label>
        </td>
    </tr>
</table>

複数項目のチェックボックスでテーブルを使わずに描画するには

<span> 要素の te:layout 属性に none を指定します．

例：テンプレートHTML (foo.html)

<span id="option" te:layout="none">
    <input type="checkbox" name="option1" /> Option1
    <input type="checkbox" name="option2" /> Option2
</span>

例：ページクラスのプロパティ (FooPage.java)

public String[] option;
public List<Map> optionItems;

例：レンダリング結果

optionItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<label><input type="checkbox" name="form:option" value="A" />AAAA</label>
<label><input type="checkbox" name="form:option" value="B" />BBBB</label>
<label><input type="checkbox" name="form:option" value="C" />CCCC</label>

単一選択の選択リストを使うには

multiple 属性を指定しない <select> 要素を記述して id 属性を付けます． <select> 要素の内容には <option> 要素を記述することができます． この <option> 要素は実行時には捨てられます (ブラウザで直接プレビューする際のモックとして活用してください)．

ページクラスに2つのプロパティを用意します． 一つめは <select> 要素の id 属性の値と同じ名前のプロパティで， 選択された項目の値を保持します．

二つめは <select> の id 属性の値に Items を加えた名前で， 型は次のいずれかです．

• 配列または java.util.List
• java.util.Map

配列または List 型の場合は， その要素型はDtoまたは java.util.Map で， label および value というプロパティ ( Map の場合はキー) でラジオボタンのラベルと値を保持します． Map の場合は， label = value というマッピングでラベルと値を保持します (順序を維持するには java.util.LinkedHashMap を使います)．

レンダリング時， <option> 要素の value 属性に value プロパティまたは Map のキーが， 内容に label プロパティまたは Map の値が設定されます．

ポストバック 時，ブラウザで選択された <option> 要素の value 属性の値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<select id="select">
    <option value="0">dummy</option>
</select>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selecteItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<select id="select" name="form:select">
    <option value="">選択してください</option>
    <option value="t">Teeda</option>
    <option value="s">SAStruts</option>
    <option value="c">Cubby</option>
</select>

選択リストで Teeda を選択してサブミットすると， ページクラスの select プロパティには "t" が設定されます．

単一選択の選択リストで項目が選択された状態で表示するには

<select> 要素の id 属性の値と同じ名前のプロパティに， 選択状態にしたい項目の値を設定します．

例：テンプレートHTML (foo.html)

<select id="select">
    <option value="0">dummy</option>
</select>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selecteItems;

例：レンダリング結果

select プロパティに "t" を設定すると， レンダリング結果は次のようになります．

<select id="select" name="form:select">
    <option value="">選択してください</option>
    <option value="t" selected="selected">Teeda</option>
    <option value="s">SAStruts</option>
    <option value="c">Cubby</option>
</select>

単一選択の選択リストで「選択してください」を出さないようにするには

<select> 要素の id 属性の値と同じ名前のプロパティを必須項目にします．

例：ページクラスのプロパティ (FooPage.java)

@Required
public String select;
public List<Map> selecteItems;

例：レンダリング結果

<select id="select" name="form:select">
    <option value="t">Teeda</option>
    <option value="s">SAStruts</option>
    <option value="c">Cubby</option>
</select>

どの項目も選択しないでサブミットすると， バリデーションでエラーとなります．

アプリケーション全体で「選択してください」が出力されないようにするには， teedaCustomize.dicon に次の定義を記述します．

<component class="org.seasar.teeda.extension.util.NullLabelStrategyImpl">
    <property name="forceNullLabel">
        @org.seasar.teeda.extension.util.NullLabelStrategy@FORCE_NO_NULL_LABEL
    </property>
</component>

単一選択の選択リストで選択されたラベルをポストバック時に受け取るには

ポストバック 時に， 選択された項目の値だけではなく， ラベルもプロパティで受け取るには， <select> 要素よりも 前 に， 隠しフィールド ( input 要素) を用意します． input 要素の id 属性は， <select> 要素の id 属性の値に ItemsSave を加えた名前を指定します．

ページクラスにラベルを受け取るプロパティを用意します． プロパティは <select> 要素の id 属性の値の値に Label を加えた名前で， 型は String とします．

ポストバック 時，ブラウザで選択された項目のラベルが <select> 要素の id 属性の値の値に Label を加えた名前のプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="hidden" id="selectItemsSave" />
<select id="select">
    <option value="0">dummy</option>
</select>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public String selectLabel;
public List<Map> selectItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<input type="hidden" id="selectItemsSave" name="form:selectItemsSave" value="..." />
<select id="select" name="form:select">
    <option value="">選択してください</option>
    <option value="t" selected="selected">Teeda</option>
    <option value="s">SAStruts</option>
    <option value="c">Cubby</option>
</select>

選択リストで Teeda を選択してサブミットすると， ページクラスの selectLabel プロパティには， "Teeda" が設定されます．

複数選択の選択リストを使うには

multiple 属性を指定した <select> 要素を記述して id 属性を付けます． <select> 要素の内容には <option> 要素を記述することができます． この <option> 要素は実行時には捨てられます (ブラウザで直接プレビューする際のモックとして活用してください)．

ページクラスに2つのプロパティを用意します． 一つめは <select> 要素の id 属性の値と同じ名前で，配列型のプロパティです．このプロパティは選択された項目の値を保持します．

二つめは <select> の id 属性の値に Items を加えた名前で， 型は次のいずれかです．

• 配列または java.util.List
• java.util.Map

配列または List 型の場合は， その要素型はDtoまたは java.util.Map で， label および value というプロパティ ( Map の場合はキー) でラジオボタンのラベルと値を保持します． Map の場合は， label = value というマッピングでラベルと値を保持します (順序を維持するには java.util.LinkedHashMap を使います)．

レンダリング時， <option> 要素の value 属性に value プロパティまたは Map のキーが， 内容に label プロパティまたは Map の値が設定されます．

ポストバック 時，ブラウザで選択された <option> 要素の value 属性の値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<select id="select" multiple="multiple">
    <option value="0">dummy</option>
</select>

例：ページクラスのプロパティ (FooPage.java)

public String[] select;
public List<Map> selecteItems;

例：レンダリング結果

selectItems が3つの要素を持つ場合， レンダリング結果は次のようになります．

<select id="select" name="form:select" multiple="multiple">
    <option value="">選択してください</option>
    <option value="t">Teeda</option>
    <option value="s">SAStruts</option>
    <option value="c">Cubby</option>
</select>

選択リストで Teeda および SAStruts を選択してサブミットすると， ページクラスの select プロパティには "t" と "s" を要素とする配列が設定されます．

複数選択の選択リストで項目が選択された状態で表示するには

<select> 要素の id 属性の値と同じ名前のプロパティに， 選択状態にしたい項目の値を要素とする配列または List を設定します．

例：テンプレートHTML (foo.html)

<select id="select" multiple="multiple">
    <option value="0">dummy</option>
</select>

例：ページクラスのプロパティ (FooPage.java)

public String select;
public List<Map> selecteItems;

例：レンダリング結果

select プロパティに "t" と "s" を要素とする配列を設定すると， レンダリング結果は次のようになります．

<select id="select" name="form:select" multiple="multiple">
    <option value="">選択してください</option>
    <option value="t" selected="selected">Teeda</option>
    <option value="s" selected="selected">SAStruts</option>
    <option value="c">Cubby</option>
</select>

複数選択の選択リストで「選択してください」を出さないようにするには

<select> 要素の id 属性の値と同じ名前のプロパティを必須項目にします．

例：ページクラスのプロパティ (FooPage.java)

@Required
public String select;
public List<Map> selecteItems;

例：レンダリング結果

<select id="select" name="form:select" multiple="multiple">
    <option value="t">Teeda</option>
    <option value="s">SAStruts</option>
    <option value="c">Cubby</option>
</select>

どの項目も選択しないでサブミットすると， バリデーションでエラーとなります．

アプリケーション全体で「選択してください」が出力されないようにするには， teedaCustomize.dicon に次の定義を記述します．

<component class="org.seasar.teeda.extension.util.NullLabelStrategyImpl">
    <property name="forceNullLabel">
        @org.seasar.teeda.extension.util.NullLabelStrategy@FORCE_NO_NULL_LABEL
    </property>
</component>

ファイルアップロードを使うには

form 要素に enctype 属性を追加し，値に multipart/form-data を指定します．

type 属性が file の <input> 要素を記述します．

<input> 要素の id 属性と同じ名前で， org.seasar.teeda.extension.util.UploadedFile 型のプロパティをページクラスに用意します． org.seasar.teeda.extension.util.UploadedFile の詳細や他に使えるプロパティの型， web.xml の設定等は「 ファイルアップロード 」を参照してください．

ポストバック 時，ブラウザからアップロードされたファイルがプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<form id="form" enctype="multipart/form-data">
    ...
    <input type="file" id="textFile" />
</form>

例：ページクラスのプロパティ (FooPage.java)

public UploadedFile textFile;

例：レンダリング結果

<input type="file" id="textFile" name="form:textFile" />

ファイル名入力フィールドでファイル foo.txt を選択してサブミットすると， ページクラスの textFile プロパティには， name プロパティに "textFile.txt" が設定された org.seasar.teeda.extension.util.UploadedFile が設定されます．

関連項目

• 機能リファレンス
  • ファイルアップロード

隠しフィールドを使うには

type 属性が hidden の <input> 要素を記述して id 属性を付け， その値と同じ名前のプロパティをページクラスに用意します．

レンダリング時， <input> 要素の value 属性にプロパティの値が設定されます． プロパティの値が '<' や '>' 等を含む場合はエスケープされます．

ポストバック 時，隠しフィールドの値がプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="hidden" id="name" />

例：ページクラスのプロパティ (FooPage.java)

public String name;

例：レンダリング結果

name プロパティの値が "Teeda" の場合， レンダリング結果は次のようになります．

<input type="hidden" id="name" name="form:name" value="Teeda" />

フォームをサブミットすると， ページクラスの name プロパティには "Teeda" が設定されます．

隠しフィールドにシリアライズしたオブジェクトを保存するには

<input> 要素の id 属性を，保存するプロパティの名前 + Save にします．

レンダリング時，プロパティの値をシリアライズしたバイト列をBase64でエンコードした文字列が <input> 要素の value 属性に設定されます．

ポストバック 時，隠しフィールドの値がデコードおよびデシリアライズされてプロパティに設定されます． ただし， 「 バリデーション 」でエラーが発生した場合は設定されません．

例：テンプレートHTML (foo.html)

<input type="hidden" id="mapSave" />

例：ページクラスのプロパティ (FooPage.java)

public Map map;

例：レンダリング結果

<input type="hidden" id="map" name="form:map" value="..." />

サブミットボタンを使うには

type 属性が submit ， button ， image のいずれかの <input> 要素を記述します．

<input> 要素に id 属性を付け， その値を do で始めて， ページクラスに同じ名前のメソッドを用意します． do～() メソッドの詳細は 「 ライフサイクル 」－「 do～()メソッド 」を参照してください．

ポストバック 時， INVOKE_APPLICATIONフェーズで do～() メソッドが呼び出されます． ただし， 「 バリデーション 」でエラーが発生した場合は呼び出されません． INVOKE_APPLICATIONフェーズについては，「 ライフサイクル 」－「 JSFライフサイクルとの関係 」を参照してください．

例：テンプレートHTML (foo.html)

<input type="submit" id="doSend" value="送信" />

例：ページクラスのメソッド (FooPage.java)

public Class doSend() {
    ...
}

例：レンダリング結果

<input type="submit" id="doSend" name="form:doSend" value="送信" />

フォームをサブミットすると， ページクラスの doSend() メソッドが呼び出されます．

関連項目

• 属性値を動的に出力するには
• プロパティファイルの内容を属性に出力するには
• ページ名の命名規約

二重サブミットを防止するには

<input> 要素の id 属性およびページクラスのメソッドを doOnce で始めます．

id 属性が doOnce で始まるサブミットボタンを含むフォームにはトランザクショントークンが埋め込まれます． ポストバック 時， トランザクショントークンがチェックされ，二重サブミットを検出すると最初のサブミットに対する応答画面へリダイレクトするか， エラー画面が表示されます．

例：テンプレートHTML (foo.html)

<input type="submit" id="doOnceSend" value="送信" />

例：ページクラスのメソッド (FooPage.java)

public Class doOnceSend() {
    ...
}

二重サブミットをクライアント側で防止するには

<input> 要素の id 属性を doOnce で始め， te:renderJs 属性に true を指定します．

レンダリング時，二重サブミットを防止するJavaScriptを記述した <script> 要素等が出力されます．

例：テンプレートHTML (foo.html)

<input type="submit" id="doOnceSend" value="送信" te:renderJs="true" />

サブミットボタンで画面遷移だけするには

<input> 要素の id 属性を go + 遷移先画面名 とします．

ポストバック 時， UPDATE_MODEL_VALUESフェーズの後に指定された画面に遷移します． ただし， 「 バリデーション 」でエラーが発生した場合は遷移しません． UPDATE_MODEL_VALUESフェーズについては，「 ライフサイクル 」－「 JSFライフサイクルとの関係 」を参照してください．

例：テンプレートHTML (foo.html)

<input type="submit" id="goNextPage" value="次ページ" />

例：レンダリング結果

<input type="submit" id="goNextPage" name="form:goNextPage" value="次ページへ" />

フォームをサブミットすると， nextPage.html に画面遷移します．

バリデーションしないで画面遷移だけするには

<input> 要素の id 属性を jump + 遷移先画面名 とします．

ポストバック 時， APPLY_REQUEST_VALUESフェーズの後に指定された画面へ遷移します． バリデーションは行われません． APPLY_REQUEST_VALUESフェーズについては，「 ライフサイクル 」－「 JSFライフサイクルとの関係 」を参照してください．

例：テンプレートHTML (foo.html)

<input type="submit" id="jumpNextPage" value="次ページ" />

例：レンダリング結果

<input type="submit" id="jumpNextPage" name="form:jumpNextPage" value="次ページへ" />

フォームをサブミットすると， バリデーションを行わずに nextPage.html に画面遷移します．