Question

我想使用BorderBehavior在不同组件周围添加其他标记。

MyBorderBehavior extends BorderBehavior {

}

<wicket:border>
<div class="myBorderBehavior">
    <wicket:body />
    <!-- some more HTML code -->
</div>
</wicket:border>

因此，在某个时候，我向组件添加了一个新的MyBorderBehavior。

MyComponent myComponent = new MyComponent().add(new MyBorderBehavior());

但是当我想通过ajax刷新myComponent

ajaxRequestTarget.add(myComponent)

再次绘制MyBorderBehavior的HTML标记，而不会删除dom中已经存在的MyBorderBehavior标记。结果，MyBorderBehavior的标记在浏览器中显示两次或更多次。

如何为可使用ajax重新渲染的组件添加边框？

到目前为止，我发现一个可行的解决方案是通过JavaScript手动删除MyBorderbehavior的标记：

MyBorderBehavior extends BorderBehavior {
    @Override
    public void onComponentTag(Component component, ComponentTag tag) {
        super.onComponentTag(component, tag);

        IValueMap attributes = tag.getAttributes();
        attributes.put("class", attributes.getString("class", "") + " hasMyBorderbehavior");
    }
}

Wicket.Event.subscribe('/dom/node/removing', function(a, attributes, c, d, e) {
    var component = $('#' + attributes['id']);
    if (component.hasClass("hasMyBorderbehavior"))
    {
        component.closest(".myBorderBehavior").replaceWith(component);
    }
});

但这似乎很hacky。

到目前为止，我发现了三种与我相关的案例：

带有BorderBehavior的组件通过Ajax重新呈现
具有BorderBehavior的组件的父组件通过ajax重新呈现
整个页面重新呈现

Answer 1

您可以将行为设置为temporary，这将克服使用Ajax重新绘制时的问题，但是在重新呈现整个页面时可能会破坏它。

一个更好的解决方案可能是覆盖BorderBehavior的beforeRender而在这是Ajax请求时不执行任何操作：

@Override public void beforeRender(Component component) {
  if (!RequestCycle.get().find(AjaxRequestTarget.class).isPresent()) {
     super.beforeRender(component);
  }
}

与afterRender()相同。

上面的代码用于Wicket 8.x，其中RequestCycle.get().find(Class<T>)返回Optional<T>。如果使用旧版本，则需要检查null，而不是：if (RequestCycle.get().find(AjaxRequestTarget.class) != null)

如何在Ajax重新渲染中使用BorderBehavior

1 个答案: