機能SAMPLE.16 「EzServlet/HTMLのincludeを利用する方法」
今回は、HTMLのインクルードについて説明します。
EzServletでは、ViewをHTMLで開発しますが「HTML」に「他のHTML」にインクルード(含む)する機能を提供します。記述の仕方は、HTMLソースのインクルードしたい箇所に下記のTGタグを記述すればOKです。
<tg:include name="インクルードするHTMLのPATH">モックHTML</tg>
あとは、インクルードするHTMLのDTOを、EzResponseのaddIncludePage(DTO)メソッドで格納しておけばOKです。
以下にインクルードされるHTMLを例に説明します。ファイル名は「jp.co.xxx.menu.Toolbar.html」です。
<html> <head></head> <body> <form method="POST"> <a name="file" href="...">ファイル</a> <a name="edit" href="...">編集</a> <a name="search" href="...">検索</a> </form> </body> </html>
DTOクラスは以下の様になります。
public class Toolbar implements Serializable { /** Toolbarに対応するコントロラークラスを保持する属性です */ public static final Class CONTROLLER_CLASS = ToolbarController.class; }
CONTROLLERクラスは以下の様になります。
public class ToolbarController { /** 「ファイル」リンクが押された時に呼び出されるメソッドです */ public void file(Toolbar toolbar) { System.out.println("ファイル・リンクが押されたよ!") // 次に表示するHTML(画面)に対応するDTOをセットします。 response.setPage(new XxxDto()); } /** 「編集」リンクが押された時に呼び出されるメソッドです */ public void edit(Toolbar toolbar) { System.out.println("編集・リンクが押されたよ!") // 次に表示するHTML(画面)に対応するDTOをセットします。 response.setPage(new YyyDto()); } /** 「検索」リンクが押された時に呼び出されるメソッドです */ public void search(Toolbar toolbar) { System.out.println("検索・リンクが押されたよ!") // 次に表示するHTML(画面)に対応するDTOをセットします。 response.setPage(new ZzzDto()); } }
以下のインクルードするHTMLを例に説明します。ファイル名は「Hoge.html」です。
<html> <head></head> <body> <tg:include name="jp.co.xxx.menu.ToolBar.html"> ここに、モック用HTMLソースを記述します。 </tg> <form method="POST"> <h1>WellComeページ</h1> <br> ようこそ<tg:out name="name">ほげほげ</tg>様 </form> </body> </html>
DTOクラスは以下の様になります。
public class Hoge implements Serializable { /** Hogeに対応するコントロラークラスを保持する属性です */ public static final Class CONTROLLER_CLASS = HogeController.class; /** 出力項目「name」を保持する属性です */ public String name; }
CONTROLLERクラスは以下の様になります。
public class HogeController { /** 初期画面を出力するメソッドです */ public void index(Hoge hoge) { // インクルードするToolbar.htmlに対応するDTOを生成します。 Toolbar toolbar = new Toolbar(); // ToolbarインスタンスをEzResponseに「include用ページ」として追加します。 response.addIncludePage(toolbar); // Hogeの出力項目「name」をセットします。 hoge.name="T.RYoken" // 表示するHtmlのDTOをセットします。 response.setPage(hoge); } }
これで、Hoge.htmlを表示すると、Toolbar.htmlをインクルードがインクルードされた状態で表示されます。
通常は、Toolbarの内容も動的に変わると思いますので、他の<tg>タグと併用して利用することになります。
また、システム開始から終了まで、情報が変わらない様なインクルードHTML(本来のメニューバー等)は、EzSessionのaddIncludePage(DTO)メソッドで格納して置く事も可能です。
超かーんたーん(o^∀^)oネッ♪