避免给 Wicket 的 ListView 一个带有正文的 html 元素

Question

我试图将嵌套的Wicket ListView结构显示为html 表，如 <div>结构。这是因为我希望这个表的一部分在运行时改变它的可见性，因此我想添加WebMarkContainers，然后对它们进行操作。
因为这很可能是html的问题，所以我开始只发布html.

<form wicket:id="matrixForm">
    <div class="table">
        <div class="table-header-group">
            <div class="table-row">
                <div class=table-cell></div>
                <div class=table-cell></div>
                <div wicket:id="columnsList" class="table-cell">
                    <div wicket:id="zustLabel"></div>
                </div>
            </div>
        </div>
        <div class="table-row-group">
            <div wicket:id="groupsList" class="table-row">
                <div wicket:id="groupLabel" class="table-cell"></div>               
                <div wicket:id="rowsList">
                    <div wicket:id="erhebungLabel" class="table-cell"></div>
                    <div wicket:id="cellList" class="table-cell">
                        <div wicket:id="cell">
                            <input wicket:id="checkbox" type="checkbox">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

基本上我不愿意有这个<div wicket:id="rowsList">，但我需要一个元素来映射我的ListView上。生成的结构为:

<div class="table">
<div class="table-header-group">
    <div class="table-row">
        <div class="table-cell"></div>
        <div class="table-cell"></div>
        <div class="table-cell">
            <div>zustLabel</div>
        </div>
        <div class="table-cell">
            <div>zustLabel</div>
        </div>
        <div class="table-cell">
            <div>zustLabel</div>
        </div>
    </div>
</div>
<div class="table-row-group">
    <div class="table-row">
        <div class="table-cell">groupLabel</div>
        <div ><!-- This is the rowsList div -->
            <div class="table-cell">erhebungLabel</div>
            <div class="table-cell">
                <div class="checked" id="cell15">
                    <input type="checkbox" checked="checked">
                </div>
            </div>
            <div class="table-cell">
                <div class="unchecked" id="cell18">
                    <input type="checkbox">
                </div>
            </div>
            <div class="table-cell">
                <div class="unchecked" id="cell17">
                    <input type="checkbox">
                </div>
            </div>
        </div>
    </div>
</div>

我用注释标记了我不想要的<div>。甚至有可能在表行组中生成与表头组中相同的结构吗?
每个标题为"xxxList"的元素代表一个ListView，所以:

• columnsList显示表头
• groupsList包装属于在一起的行
• rowsList显示组的子类别
• cellList用复选框填充空闲字段

它更像是一个授权矩阵而不是一个数据表。我给了类适当的display:[table element]属性，使它们表现得像一个表。

小提琴演示

Answer 1

可以使用

& lt; wicket:容器wicket: id = " rowsList祝辞& lt;/wicket: container>

而不是