想定する状況

デザイナ(コーダ？)とプログラマが分業しているとして、
納品された HTML に、修正を加えていくフロー。
動的項目の挿入のためのマーカとしてのマークアップを HTML に挿入する必要があるというシュチュエーションで、
挿入したマークアップが原因で UI が壊れてしまった。

解決策

1. デザイナと相談してマークアップ自体を変更してもらう。

これも解決策。
ただ、マークアップとして意味がないものを挿入したりすることになると、デザイナもいい顔はしなそうに思います。

2. <wicket:container > を使用する。

<wicket:container > を使用すると、最終的に出力されるマークアップを汚さずに、
wicket 側のコンポーネントの挿入ポイントを定義することができます。
マークアップはいらないのだけど、動的項目を出力したいというケースはこちらを
使用するのが良い気がします。

<div>
    <wicket:container wicket:id="labelText"></wicket:container>
</div>

  • Java

    // Add Label
    add(new Label("labelText","Hello World..."));

  • OUTPUT

<div>
    Hello World...
</div>

3. Component#setRenderBodyOnly を使用する。

ユーザーガイドの記載の通りなのですが、
* 6.8 How to render component body only

Component#setRenderBodyOnly を true にすることで、マークアップを出力しないようにすることができます。
こちらは、 ListView 内でマークアップ表示/非表示を条件によって切り替えたい場合、使えそうです。

その他の HTML 表示切替系の参考機能

以下、ユーザーガイドの6.9、6.10 に記載された機能についてです。
こちらも、マークアップに影響を及ぼさずに実装を行うために使えそうです。

wicket:enclosure タグ

Border

上記機能の Example

6.8、6.9、6.10 の Example コードは以下に存在します。

以上です。

コメント

カテゴリー

最近の投稿