Tapestry JavaScript(2)
前回簡単なJavaScriptテンプレートのサンプルを載せました。 TagListコンポーネントをHTMLテンプレートから呼び出すと自動的にJavaScriptも出力されるわけですが、同じページに２つTagListコンポーネントを使用すると変数名やfunctionの重複が発生します。 重複を回避するために<unique>を使用します。この他にもJavaScriptテンプレートには、使用可能なエレメントが存在します。これらについて説明していきたいと思います。
<unique>エレメント
重複例
HTMLテンプレート<span jwcid="@TagList" /> <span jwcid="@TagList" />出力されるHTML
<script type="text/javascript"><!--
var name = "12345";
alert(name);
var name = "12345";
alert(name);
// --></script>
上記の出力結果では、１つのscriptタグ内にまとめられてはいますが、変数名の重複が起こっています。 また、alertは１回だけ表示したい時もあります。
重複の回避
同じものを表示させないようにするには、<unique>エレメントを使用します。
-WEB-INF/jwc/TagList.script
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE script
PUBLIC "-//Apache Software Foundation//Tapestry Script Specification 3.0//EN"
"http://jakarta.apache.org/tapestry/dtd/Script_3_0.dtd">
<script>
<body>
<unique>
var ${varName} = "${varValue}";
</unique>
alert(name);
</body>
</script>
上記のように変数の値の部分のみをuniqueエレメントで囲うことで、同じコンポーネントを２回使用してもページ内には１回のみ表示されるようになります。( alert文はuniqueエレメントで囲っていませんので２回表示されます）
出力されるHTML
<script type="text/javascript"><!--
var name = "12345";
alert(name);
alert(name);
// --></script>
initializationエレメント
JavaScriptを記述するとページを総て読み込んだ後に特定の関数を実行したいことがあります。 window.onload = function ()等で指定しても良いのですが、Tapestryでは、ページの最後（body終了タグの直前）にJavaScriptを埋め込む命令があります。
-WEB-INF/jwc/TagList.script
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE script
PUBLIC "-//Apache Software Foundation//Tapestry Script Specification 3.0//EN"
"http://jakarta.apache.org/tapestry/dtd/Script_3_0.dtd">
<script>
<body>
<unique>
var ${varName} = "${varValue}";
</unique>
<initialization>
alert(name);
</initialization>
</body>
</script>
HTML出力結果
..... <script language="JavaScript" type="text/javascript"><!-- alert(name); // --></script> </body>initializationタグで囲まれた部分が、HTMLの最後に表示されます。もちろんこの中でuniqueエレメントを使用する事も可能です。
input-symbolエレメント
.java ファイルから指定される変数を定義します。 オプションとして用意されているエレメントですので、記述してもしなくてもかまいません。 多くの変数を扱うときScriptテンプレート側で変数名等を明確にしたいときに使用します。
-TagList.java
Map symbols = new HashMap();
symbols.put("varName","name");
symbols.put("varValue","12345");
getScript().execute(aCycle,pageRenderSupport,symbols);
-TagList.script
<input-symbol key="varName" class="java.lang.String" required="yes"/> <input-symbol key="varValue" class="java.lang.String" required="yes"/>
forearchエレメント
名前の通り繰り返し処理を行います。
-TagList.script
<input-symbol key="bookmarkList" class="java.util.List" required="yes"/>
....
<foreach key="keyObj" index="no" expression="bookmarkList">
${keyObj.getTitle()};
${no};
</foreach>
-出力例
title0; 0; title2; 1;-TagList.java
symbols.put("bookmarkList",list);
getScript().execute(aCycle,pageRenderSupport,symbols);
上記の例ではListクラスを指定しており、リストのアイテム数回繰り返しを行います。 List以外を指定するときは以下の通りにします。
Setを指定<input-symbol key="bookmarkList" class="java.util.List" required="yes"/>Mapを指定
<input-symbol key="bookmarkMap" class="java.util.Map" required="yes"/>
<foreach key="keyObj" index="no" expression="bookmarkMap.keySet()">
${keyObj.getTitle()};
${no};
</foreach>
Tapestry JavaScript(1)にアノテートによるScriptテンプレートファイルの指定方法を追加しました。 http://www.taosoftware.co.jp/blog/2006/03/tapestry_javascript.html#more
