PrimeFaces 3維DataTable

Question

我有一個2D數據表，我想在裏面插入可變數量的面板，實質上是創建一個3D數據表。

二維表如下所示： LL

<p:dataTable var="rowName" value="#{tableBean.rowNames}"> 
    <p:column headerText="" styleClass="ui-widget-header"> 
     <h:outputText value="#{rowName}"/> 
    </p:column> 

    <p:columns var="columnName" value="#{tableBean.colNames}" headerText="#{columnName}"> 
     <p:panel> 
     <h:outputText value="panel"/> 
     </p:panel> 
    </p:columns> 
</p:dataTable> 

而Java：

import javax.faces.bean.ManagedBean; 
import javax.faces.bean.RequestScoped; 
import java.util.ArrayList; 
import java.util.List; 

@ManagedBean 
@RequestScoped 
public class TableBean { 
    private List<String> rowNames = new ArrayList<String>(); 
    private List<String> colNames = new ArrayList<String>(); 
    private ArrayList<ArrayList<ArrayList<String>>> data3D = new ArrayList<ArrayList<ArrayList<String>>>(); 

    public TableBean() { 
     rowNames.add("row1"); 
     rowNames.add("row2"); 

     colNames.add("col1"); 
     colNames.add("col2"); 
     colNames.add("col3"); 

     // Setup 3 dimensional structure 
     for (int i = 0; i < rowNames.size(); i++) { 
      data3D.add(new ArrayList<ArrayList<String>>()); 
      for (int j = 0; j < colNames.size(); j++) { 
       data3D.get(i).add(new ArrayList<String>()); 
      } 
     } 

     // row 1, col 1, 3 items 
     data3D.get(0).get(0).add("item1"); 
     data3D.get(0).get(0).add("item2"); 
     data3D.get(0).get(0).add("item3"); 

     // row 1, col 2, 1 items 
     data3D.get(0).get(1).add("item1"); 

     // row 1, col 3, 2 items 
     data3D.get(0).get(2).add("item1"); 
     data3D.get(0).get(2).add("item2"); 

     // row 2, col 1, 2 item 
     data3D.get(1).get(0).add("item1"); 
     data3D.get(1).get(0).add("item2"); 

     // row 2, col 2, 1 item 
     data3D.get(1).get(1).add("item1"); 
    } 

    public List<String> getRowNames() { return rowNames; } 
    public void setRowNames(List<String> rowNames) { this.rowNames = rowNames; } 

    public List<String> getColNames() { return colNames; } 
    public void setColNames(List<String> colNames) { this.colNames = colNames; } 

    public ArrayList<ArrayList<ArrayList<String>>> getData3D() { return data3D; } 
    public void setData3D(ArrayList<ArrayList<ArrayList<String>>> data3D) { this.data3D = data3D; } 
} 

但我想實現如下，其中P1，P2，P3，等有PrimeFaces面板：

+------+--------+--------+--------+-- 
|  | Col1 | Col2 | Col3 | .... .... .... .... 
+------+--------+--------+--------+-- 
|  | +----+ | +----+ | +----+ | 
|  | | p1 | | | p1 | | | p1 | | 
|  | +----+ | +----+ | +----+ | 
| Row1 | | p2 | |  | | p2 | | 
|  | +----+ |  | +----+ | 
|  | | p3 | |  |  | 
|  | +----+ |  |  | 
+------+--------+--------+--------+ 
|  | +----+ | +----+ |  | 
|  | | p1 | | | p1 | |  | 
| Row2 | +----+ | +----+ |  | 
|  | | p2 | |  |  | 
|  | +----+ |  |  | 
+------+--------+--------+--------+ 
| .... | 
| .... | 
    .... 

是有可能使用第三維（字符串列表）爲DataTable的每個單元格內的每個字符串創建一個面板？

Answer 1

RongNK提出的解決方案是使用ui：repeat。通過使用大括號[][]，可以指定第三維數組。行和列的索引可以分別從rowIndexVar和colIndexVar屬性中獲得，分別來自<p:dataTable>和<p:columns>。

<p:dataTable var="rowName" value="#{tableBean.rowNames}" rowIndexVar="rowIdx"> 
    <p:column headerText="" styleClass="ui-widget-header"> 
     <h:outputText value="#{rowName}"/> 
    </p:column> 

    <p:columns var="columnName" value="#{tableBean.colNames}" headerText="#{columnName}" 
       columnIndexVar="colIdx"> 
     <ui:repeat value="#{tableBean.data3D[rowIdx][colIdx]}" var="data"> 
      <p:panel> 
       <h:outputText value="#{data}"/> 
      </p:panel> 
     </ui:repeat> 
    </p:columns> 
</p:dataTable>