I am trying to implement a simple dropdown which is updated based on the selection of another dropdown with Wicket 6.19. So far so good, the dropdown work as they should. The problem is that I am using a customized dropdown choice component where in the renderHead methode the uniform() methode is called.
@Override
public void renderHead(IHeaderResponse response) {
super.renderHead(response);
response.render(OnDomReadyHeaderItem.forScript("$('#" + getMarkupId(true) + "').uniform();"));
}
This methode (it was written by someone else) is always called when I invoke the modelChanged() methode of my dropdown to be updated. Thus, a new div element is created everytime this renderHead method is called which results on the screen in a shadow aound the component.
Generated HTML after changing the selection of the dropdown several times
When I remove the code with the uniform, the addional divs are not generated but the drop down has the wrong style. I am not familiar with the uniform methode. I would really appreciate your help how to fix this.
I know quite some time passed since my question but recently I came by a solution. I know this is probably not the best solution but it works for me and maybe it helps someone who stumbles over the same problem.
In this solution I remove the div and child span element before performing uniform again. This way, I have only one div after I invoke the uniform method.
@Override
public void renderHead(IHeaderResponse response) {
super.renderHead(response);
if(hasBeenRendered())
response.render(OnDomReadyHeaderItem.forScript("$('#" + getMarkupId(true) + "').parent().replaceWith(function() {return $('select', this);});"));
response.render(OnDomReadyHeaderItem.forScript("$('#" + getMarkupId(true) + "').uniform();"));
}