Odtnhj

I want to use a BorderBehavior to add additional markup around different components.

MyBorderBehavior extends BorderBehavior 



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

So at some point, I add a new MyBorderBehavior to a component.

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

But when I want to refresh myComponent via ajax

ajaxRequestTarget.add(myComponent)

The Html markup of MyBorderBehavior is drawn again without removing the already existing markup of MyBorderBehavior in the dom. As a result, the markup of MyBorderBehavior is shown twice or more often in the browser.

How can I add a border to a component which can be re-rendered with ajax?

A working solution I found so far is to remove the markup of MyBorderbehavior manually via JavaScript:

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);
 
);

But this seems to be very hacky.

There are three cases I found so far which are relevant for me:

1. The component with the BorderBehavior is rerendered via ajax


2. A parent component of the component with the BorderBehavior is rerendered via ajax


3. The whole page is rerendered

You can make your Behavior temporary and this will overcome the problem when re-painting with Ajax, but might break it when re-rendering the whole page.

A better solution probably is to override beforeRender of BorderBehavior and do nothing when this is an Ajax request:

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

Same for afterRender().

The code above is for Wicket 8.x where RequestCycle.get().find(Class<T>) returns Optional<T>. If you use older version then you need to check for null instead: if (RequestCycle.get().find(AjaxRequestTarget.class) != null)