nested loop view

[Luther Baker]

I'm trying to create a page - similar to Jira's BROWSE PROJECTS.

My initial take amounts to a loop in a loop.

The outer loop is CATEGORIES and the inner loop is PROJECTS in said
category.

| CATEGORY 1
| p1
| p2
| p3

| CATEGORY 2
| p4
| p5
| p6

...

I've attached code below but if I removed the nested loop, I can easily loop
over just CATEGORIES but as soon as I add the nested loop, it fails with the
following

WicketMessage: Error attaching this container for rendering: [Page class =
com.fuzzybearings.milestones.web.page.user.ProjectsPage, id = 3, version =
0]

Root cause:

java.lang.IllegalArgumentException: A child with id 'projects' already
exists:
[MarkupContainer [Component id = categories]]


My intuition tells me that 'wicket:id="projects"' is repeating since it is
contained in an outer loop ... but I'm not sure how else to identify this
type of structure in a general way. Is there a loop container more suited to
this ... open to suggestions.

Thanks in advance,

-Luther



*.html snippet

        <div wicket:id="categories">
        <table>
            <tr wicket:id="projects">
                <td><a wicket:id="projectLink" href="#"><span
wicket:id="projectLabel">[project]</span></a></td>
            </tr>
        </table>
        </div>


*.java snippet

    public ProjectsPage(ResourceModel bodyTitle)
    {
        super(bodyTitle);

        ListView categories = new ListView("categories",
this.getCategories())
        {

            @Override
            protected void populateItem(ListItem item)
            {
                Category category = (Category) item.getModelObject();

                ListView projects = new ListView("projects",
ProjectsPage.this.getProjects(category))
                {

                    @Override
                    protected void populateItem(ListItem item)
                    {
                        Project project = (Project) item.getModelObject();
                        Link link = new Link("projectLink", item.getModel())
                        {

                            @Override
                            public void onClick() { ... }
                        };
                        link.add(new Label("projectLabel",
project.getName()));
                        item.add(link);
                    }
                };
                this.add(projects);
            }
        };
        this.add(categories);
    }