こんなテーブルがあって、
列Ｂは条件により、表示させたりさせなかったりしたい。
thやtdをdivやspanで囲んだりするとhtml文法的に正しくないので、単純にdivやspanで囲んでm:ifで表示/非表示制御、とはしたくない。
まずmayaaで、
<m:if m:id="visible" test="${条件}" />とやってしまうと、列Ｂが出る条件のときに、
<table border="1">
<tr>
<th>列Ａ</th>
列Ｂ
<th>列Ｃ</th>
</tr>
<tr>
<td>データＡ</td>
データＢ
<td>データＣ</td>
</tr>
</table>のようなhtmlが出力され、thやtdがなくなって、残念な出力になってしまう。
Mayaaはidのついたタグ単位でごっそり置き換えるので、あたりまえといえばあたりまえ。
で、
<m:if m:id="visible" test="${条件}" replace="false" />というふうに、replace="false"をつけてあげると、htmlのタグは置き換わらず残って、
<table border="1">
<tr>
<th>列Ａ</th>
<th id="xxx">列Ｂ</th>
<th>列Ｃ</th>
</tr>
<tr>
<td>データＡ</td>
<td id="xxx">データＢ</td>
<td>データＣ</td>
</tr>
</table>となってうまくいく。
ところが今度は列Ｂが出ない条件のときに、
<table border="1">
<tr>
<th>列Ａ</th>
<th id="xxx"></th>
<th>列Ｃ</th>
</tr>
<tr>
<td>データＡ</td>
<td id="xxx"></td>
<td>データＣ</td>
</tr>
</table>と空タグが残ってしまい、残念な結果となる。
結局、以下のように対応。
これがベストプラクティスなのかどうかはわかりませんが、やりたいことはできました。
まず、表示/非表示用のタグをid="visible"として書いて、その内側にthタグやtdタグの出力用spanタグを書く。表示させるデータも可変であればさらにその内側にデータ用spanタグを書く。
mayaaでは、m:ifでid="visible"に対する記述でそもそもの表示/非表示を制御し、m:elementでthタグやtdタグを出力する。
これで、望みの結果が得られた。
[html]
<table border=1>
<tr>
<th>列Ａ</th>
<th id="visible">
<span id="th">列Ｂ</span>
</th>
<th>列Ｃ</th>
</tr>
<tr>
<td>データＡ</td>
<td id="visible">
<span id="td">
<span id="datab">データＢ</span>
</span>
</td>
<td>データＣ</td>
</tr>
</table>[mayaa]
<m:if m:id="visible" test="${条件}" />
<m:element m:id="th" name="th" />
<m:element m:id="td" name="td" />
<m:write m:id="datab" value="データＢです" />デザインとロジックの分離がイマイチになっちゃうのが難点。
うーん、やりたいことは簡単なのに。。。
もっとベストなやり方があるのだろうか。。。
------------------------------
5/17 追記
コメントでm:echoを使ったやり方を教えていただきました。
<m:if m:id="visible" test="${条件}" />のところを、
<m:if m:id="visible" test="${条件}">
<m:echo><m:doBody /></m:echo>
</m:if>にすれば、m:elementが不要になり、mayaaがスッキリします。
よって、tdやthを出すために使っているspanも不要なり、htmlもスッキリします。
m:echoはタグの属性を変えるものだとばかり思ってましたが、ちょっとわかりずらいけどこういう使い方もあるのか、と勉強になりました。
