Question: I need to create a table structured as shown below:

```
+----+--------+
| ID | Values |
+----+--------+
|  1 | val 1  |
+----+--------+
|    | val2   |
+----+--------+
|    | val 3  |
+----+--------+
|  2 | val 4  |
+----+--------+
|    | val 5  |
+----+--------+

```

i.e. the first column values may extend over multiple rows. 

My JSF object is;

```
class abc {
    int id;
    String[] values;
}

```

Answer: 
You would do something like this:

```
public class DataBean {
 private List<abc> list;

 public DataBean() {
  list = new ArrayList<abc>();
  populate(list); // method that populates your List
 }

 // getter and setters

```

In your .xhtml page you will do:

```
<h:dataTable value="#{dataBean.list}" var = "item">
 <h:column>
  <f:facet name="header">
   <h:outputText value="Id" />
  </f:facet>
  <h:outputText value="#{item.id} />
 </h:column>
 <h:column>
  <f:facet name="header">
   <h:outputText value="Values" />
  </f:facet>
  <ui:repeat value="#{item.values}" var = "value">
   <h:outputText value="#{value} /><br />
  </ui:repeat>
 </h:column>
</h:dataTable>

```
I ended up using a PrimeFaces implementation of panelGrid:

```
<p:panelGrid>
    <p:row>
        <p:column rowspan="2">Header 1</p:column>
        <p:column>attrib 1 1</p:column>
        <p:column>arrtib 1 2</p:column>
    </p:row>
    <p:row>
        <p:column>attrib 2 1</p:column>
        <p:column>arrtib 2 2</p:column>
    </p:row>
</p:panelGrid>

```