将动态元素 ID 添加到 Wicket 中的 dom

Question

我有一个重复视图，里面有一个容器。另外，我向这个容器添加了具有行为的元素。

RepeatingView listItems = new RepeatingView("listItems");
    listItems.setOutputMarkupId(true);
    listItems.setRenderBodyOnly(true);
    for (int i = 0; i < typeList.size(); i++) {
        WebMarkupContainer container = new WebMarkupContainer(listItems.newChildId());
        container.setOutputMarkupId(true);
        Label typeLabel = (Label) new Label("typeLabel" + i, "label");
        container.add(typeLabel);
        container.add(createMultiChoiceForCustomType("choice" + i, i));
        listItems.add(container);
    }
    add(listItems);

和HTML

<div class="otherPermissionsOption">
      <div wicket:id="listItems"></div>
</div>

我在控制台中遇到错误

Wicket.Ajax: Cannot bind a listener for event "change.select2" on element "id13c" because the element is not in the DOM

如何将动态容器+元素 ID 放在 HTML 页面上以消除此错误？是否可以在 Wicket 中使用动态容器？

Answer 1

 listItems.setOutputMarkupId(true);
 listItems.setRenderBodyOnly(true);

这两行自相矛盾。

listItems.setOutputMarkupId(true); 说-我希望 Wicket 将 id 属性添加到 HTML 元素并为其生成唯一值

listItems.setRenderBodyOnly(true); 说 - 我不需要 HTML 元素标签（将其所有属性）。我希望 Wicket 仅呈现该组件的子组件。您需要将其删除。

您的标记应包含 HTML 个子元素：

<div class="otherPermissionsOption">
  <div wicket:id="listItems">
    <span wicket:id="typeLabel"></span>
    <div wicket:id="choice"></div>
  </div>
</div>

并且Java代码中的组件id不需要添加+ i。

也不需要在以下位置投射：

... = (Label) new Label("typeLabel" + i, "label");

Answer 2

为未来的挖掘者修复了代码示例

JAVA

    RepeatingView listItems = new RepeatingView("documentAppItemContainer");

    for (int i = 0; i < typeList.size(); i++) {
        WebMarkupContainer documentAppContainer = new WebMarkupContainer(listItems.newChildId());
        WebMarkupContainer documentAppPanel = new WebMarkupContainer("documentAppItem");
        Label typeLabel = new Label("documentAppLabel", "label");
        documentAppPanel.add(typeLabel);
        documentAppPanel.add(createMultiChoiceForCustomType("documentAppSettings", i));
        documentAppContainer.add(documentAppPanel);
        listItems.add(documentAppContainer);
    }
    add(listItems);

HTML

    <div wicket:id="documentAppItemContainer">
        <div wicket:id="documentAppItem">
            <wicket:component wicket:id="documentAppLabel"/>
            <wicket:component wicket:id="documentAppSettings"/>
        </div>
    </div>

将动态元素 ID 添加到 Wicket 中的 dom

Adding dynamic element ids to the dom in Wicket

java

wicket