機能SAMPLE.8 「EzServlet/selectタグを利用する方法」
今回は、selectタグの利用方法について説明します。
EzServletは、HTMLでビューを作成します。HTMLでは、主にデザインを設計し、極力ロジックは入れない設計になっています。(出力項目、繰り返し項目、表示・非表示項目の設定を行う程度にしています)
画面の表示・非表示制御等のロジックに関する処理は、「DTO」及び「Controller」に記述します。
selectタグは、他のタグと多少異なり「画面に表示する値」と選択された時に「サーバーに受け渡す値」を別々に(optionに)指定するタグです。
また、場合によっては、選択する内容を状況に応じて動的に変更する必要があったります。
EzServletでは「selectタグ」を容易に利用するための「専用クラス:EzSelect」が用意されています。
EzSelectの記述方法を説明します。
EzSelect selectField = new EzSelect("プロパティーファイルのPATH") .addOption("画面表示用プロパティー・キー1","選択値1") .addOption("画面表示用プロパティー・キー2","選択値2") .addOption("画面表示用プロパティー・キー3","選択値3") .init("選択値2");
具体的にEzSelectの説明をしていきます。
EzSelectを利用する事により、動的なselectタグもControllerによって制御する事
1.コンストラクター
new EzSelect("プロパティーファイルのPATH")のシグニチャで受け渡される値は、画面に表示される値が設定され
ているプロパティーファイルのpathを指定します。2.addOptionメソッド
addOptionメソッドは、selectタグの<option>タグを設定するメソッドです。
addOption("画面表示用プロパティー・キー1","選択値1")のシグニチャの内容は下記の通りです。
・第一引数:"画面表示用プロパティー・キー1"は、画面に表示される値のプロパティー・キーです。コンストラ
クターで指定されたプロパティーファイルより値を取得します。
・第二引数:"選択値1"は、選択された時に受け渡される値です。EzSelect#getValueメソッドで取得する事が出
来ます。
3.initメソッド
initメソッドは、選択された値をセットするメソッドです。
init("選択値2")のシグニチャは、選択されたoptionの第二引数の値をセットします。
が可能になります。
HTMLに記述されたselectタグは、実行事にEzselectクラスで設定された内容に置き換えられます。
以下のHTMLを例に説明します。ファイル名は「Hoge.html」です。
<html> <head></head> <body> <form method="POST"> <select name="selectField"> <option>選択項目1</option> <option>選択項目2</option> <option>選択項目3</option> </select> <input type="button" name="execute" value="実行"> </form> </body> </html>
DTOは以下の様になります。
public class Hoge implements Serializable { /** Hogeに対応するコントロラークラスを保持する属性です */ public static final Class CONTROLLER_CLASS = HogeController.class; /** selectタグ「selectField」の情報を保持する属性です */ public EzSelect selectField = new EzSelect("jp/co/xxx/Hoge1"); }
プロパティー・ファイル(jp/co/xxx/Hoge1.properties)は以下の様になります。
#Hoge1.htmlのselectタグ「selectField」の画面表示値の設定値 select.selectField1="項目1" select.selectField2="項目2" select.selectField3="項目3"
CONTROLLERクラスは以下の様になります。
public class HogeController { /** 初期画面を表示するメソッドです。*/ public void index(Hoge hoge) { // selectタグ「selectfield」の情報を初期化します。 hoge.selectField.clear(); // selectタグ「selectfield」のoptionを設定します。 hoge.selectField.addOption("select.selectField1","1"), .addOption("select.selectField2","2"), .addOption("select.selectField3","3"); .init("3"); } /** 「実行」ボタンが押された時に呼び出されるメソッドです。*/ public void execute(Hoge hoge) { // 画面入力値をDTOにセットします。 request.set(hoge); // 選択された値を出力します。 system.out.println(hoge.selectField.getValue()); // 表示するHtmlのDTOをセットします。 response.setPage(hoge); } }
今回の例では、動的なselectタグの例を記述しましたが、静的なselectタグを利用する場合は、DTOのプロパティーの設定で「流れるようなインターフェース」を利用して設定することが可能です。
POINT2!
EzSelectクラスは、上記の通りプロパティーファイルを利用してロケールに対応した記述も可能ですが、ロケールの対応が不要である場合は、下記のような記述も可能です。
EzSelect selectField = new EzSelect() .addOption("画面表示値1","選択値1") .addOption("画面表示値1","選択値2") .addOption("画面表示値1","選択値3") .init("選択値2");
超かーんたーん(o^∀^)oネッ♪