1

I'm Creating table with Vaadin. Some of the cells are repeating. So I want them to merge in one cell, as you can see on the image:enter image description here

The first image show how the table looks now, and the second is how I want to look with merged cells.

I'm using this code:

Table table = new Table(AppData.getMessage("menu.report2"));
table.addContainerProperty(tableHeaders[0], String.class, null);
table.addContainerProperty(tableHeaders[1], String.class, null);
table.addContainerProperty(tableHeaders[2], String.class, null);
table.addContainerProperty(tableHeaders[3], String.class, null);

List<User> employeeList = employeeDAO.findAllEmployees();
int i;
for (i = 0; i < employeeList.size(); i++) {
    User employee = employeeList.get(i);
    table.addItem(new Object[]{
            CaseStatus.OPEN,
            tasksDAO.countTasks(CaseStatus.OPEN),
            employee.getFirstAndLastName(),
            tasksDAO.countTasks(employee, CaseStatus.OPEN)},
            i);
}

for (int j = 0; j < employeeList.size(); j++) {
    User employee = employeeList.get(j);
    table.addItem(new Object[]{
            CaseStatus.CLOSED,
            tasksDAO.countTasks(CaseStatus.CLOSED),
            employee.getFirstAndLastName(),
            tasksDAO.countTasks(employee, CaseStatus.CLOSED)},
            i + j);
}


table.setPageLength(table.size());

addComponent(table);
setComponentAlignment(table, Alignment.TOP_CENTER);
setMargin(true);
jsosnowski
  • 1,560
  • 3
  • 26
  • 56
KiKo
  • 1,668
  • 7
  • 27
  • 56

1 Answers1

1

I think, this is not possible in "normal way". But I have an idea how to simulate this.

First solution:

You could simply use GridLayout to build grid as you want. Then nothing limit your imagination beside size of such grid. It shouldn't be to big (also pointed here).

Second solution:

Another advice is a bit crazy.

  1. Disable Table/Grid stripes.
  2. In group of similar cells just fill only first row. Left rest blank (or space in string).

Then you dispose of repeated data (from your first and second column), but you can't alignment them vertically (the text will stay at top - first row from group).

Third solution:

Check Add-ons list. For example ItemGrid.

Community
  • 1
  • 1
jsosnowski
  • 1,560
  • 3
  • 26
  • 56
  • OK, I used GridLayout to create the table, so now how can I add table lines on this layout ?? – KiKo Sep 23 '15 at 12:02
  • Please look at [this answer](http://stackoverflow.com/a/5622571). I think the simplest way - use CSS. – jsosnowski Sep 23 '15 at 12:39