Hi Wicket users,

I've a ListView in a ListView. The 1st ListVeiw holds "categories". The 2nd ListView holds links (topics) which I want to be highlighted if the link (topic) is clicked. The problem is that the wrapped list (container) is getting refreshed, but the CSS class is not set for the corresponding list item.
Below my code:

import java.io.Serializable;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

import org.apache.wicket.AttributeModifier;
import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.ajax.markup.html.AjaxLink;
import org.apache.wicket.markup.html.WebMarkupContainer;
import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.markup.html.list.ListItem;
import org.apache.wicket.markup.html.list.ListView;
import org.apache.wicket.model.Model;
import org.wicketstuff.annotation.mount.MountPath;

@MountPath(path = "test")
@SuppressWarnings("serial")
public class TestPage extends WebPage {

public TestPage() {
final WebMarkupContainer container = new WebMarkupContainer("container");
container.setOutputMarkupId(true);

container.add(new ListView<Category>("categories", buildCategories()) {
@Override
protected void populateItem(ListItem<Category> item) {
Category category = item.getModelObject();
item.add(new Label("category", category.getName()));
item.add(new ListView<Topic>("topics", category.getTopics()) {
@Override
protected void populateItem(final ListItem<Topic> item) {
Topic topic = item.getModelObject();
AjaxLink<String> topicLink = (new AjaxLink<String>("topicLink") {
@Override
public void onClick(AjaxRequestTarget target) {
item.add(new AttributeModifier("class", new Model<String>("highlight")));
target.addComponent(container);
}
});
topicLink.add(new Label("topic", topic.getName()));
item.add(topicLink);
}
});
}
});
add(container);
}

private class Category implements Serializable {
private String name;
private List<Topic> topics;

public Category (String name, List<Topic> topics) {
this.name = name;
this.topics = topics;
}

public String getName() {
return name;
}

public List<Topic> getTopics() {
return topics;
}
}

private class Topic implements Serializable {
private String name;

public Topic (String name) {
this.name = name;
}

public String getName() {
return name;
}
}

private List<Category> buildCategories() {
List<Category> categories = new ArrayList<Category>();
categories.add(new Category("Movies", Arrays.asList(new Topic("Mamma"), new Topic("USA"), new Topic("NL")))); categories.add(new Category("Articles", Arrays.asList(new Topic("Test"), new Topic("Nederland")))); categories.add(new Category("Images", Arrays.asList(new Topic("Mag"), new Topic("Spullen"), new Topic("Mamma mia")))); categories.add(new Category("Links", Arrays.asList(new Topic("Ana"), new Topic("Smiti"), new Topic("Hbiloo"), new Topic("Yeeh"))));
return categories;
}
}

<ul class="menu" wicket:id="container">
<li class="r" wicket:id="categories">
<span class="category" wicket:id="category">Category A: </span>
<ul>
<li wicket:id="topics">
<a wicket:id="topicLink"><span wicket:id="topic">Link</span></a>
</li>
</ul>
</li>
</ul>


Hbiloo.

Reply via email to