JSF / JBoss Seam how-to: splitting one List<Item> over several ListBoxes (h:selectManyListbox)

I'm using these classes:

ShoppingCart   <-ManyToMany->   Item   <-ManyToOne->  ItemCategory

All of them are JPA @Entitys with relevant getters and setters for relations:

Shopping cart:

public class ShoppingCart {
  ...
  @ManyToMany
  public List<Item> getItems() {
    return items;
  }
  ...
}

Item:

public class Item {
  ...
  @ManyToOne
  public ItemCategory<Item> getCategory() {
    return category;
  }
  ...
}

Item category:

public class ItemCategory {
  ...
}

The question:

Let's say I have:

Item1, Item2, Item3 in ItemCategory1

Item4, Item5, Item6 in 开发者_StackOverflow社区ItemCategory2

I'm trying to build a page where you can choose the shoppingcart.items like this:

ItemCategory1: +-----------+
               | Item1     |
               | Item2     |
               | Item3     |  (multi-select with Ctrl)
               +-----------+

ItemCategory2: +-----------+
               | Item4     |
               | Item5     |
               | Item6     |  (multi-select with Ctrl)
               +-----------+

How can I do this with JSF/Facelets/Seam ?

Do you have better suggestions for the UI ? (I don't want it to be tree-based or single listbox)

Thanks.

In a method where you initialize initialize your object (perhaps @PostConstruct), split the values. For example in

private Map<ItemCategory<Item>, List<Item>> itemsByCategory;

And then iterate with

<ui:repeat value="#{bean.itemsByCategory.entries}" var="entry">
     // show inputs, using entry.key and entry.value
</ui:repeat>