在 JSF 中的单个标题下对列进行分组答案

【问题标题】：Grouping columns under a single header in JSF在 JSF 中的单个标题下对列进行分组
【发布时间】：2008-11-03 17:07:41
【问题描述】：

有没有办法使用 JSF 将两个或多个列分组到 JSF 中的单个父列下？我有一个 dataTableEx，里面有 hx:columnEx 列。我想要的是这样的：

 [MAIN HEADER FOR COL1+2   ][Header for Col 3+4]

 [ COL1 Header][COL2 Header][COL3    ][COL 4   ] 

 Data          Data             Data     Data

 Data          Data             Data     Data

 Data          Data             Data     Data

 Data          Data             Data     Data

数据数据数据数据

谢谢

【问题讨论】：

标签： jsf hxdatatableex

【解决方案1】：

您可以使用表格标题、panelGrid 和一点 CSS 来实现您想要的。

<style type="text/css">
.colstyle {
    width: 25%
}
</style>
</head>
<body>

<f:view>
    <h:dataTable border="1" value="#{columnsBean.rows}" var="row"
        columnClasses="colstyle">
        <f:facet name="header">
            <h:panelGrid columns="2" border="1" style="width: 100%">
                <h:outputLabel style="width: 100%" value="MAIN HEADER FOR COL1+2" />
                <h:outputLabel style="width: 100%" value="MAIN HEADER FOR COL3+4" />
            </h:panelGrid>
        </f:facet>
        <h:column>
            <f:facet name="header">
                <h:outputText value="COL1 Header" />
            </f:facet>
            <h:outputLabel value="#{row.col1}" />
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="COL2 Header" />
            </f:facet>
            <h:outputLabel value="#{row.col2}" />
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="COL3 Header" />
            </f:facet>
            <h:outputLabel value="#{row.col3}" />
        </h:column>
        <h:column>
            <f:facet name="header">
                <h:outputText value="COL4 Header" />
            </f:facet>
            <h:outputLabel value="#{row.col4}" />
        </h:column>
    </h:dataTable>
</f:view>

【讨论】：

【解决方案2】：

最好的办法是为第一个表头使用嵌套表（外部表中的第一个表头，嵌套表中的第二个表头和数据），使其看起来像两个表头。

【讨论】：

嵌套 JSF 数据表是个坏主意。
外部表不会是 JSF 数据表，只是内部表。外面的只会显示你想要的列标题。

【解决方案3】：

也许您可以看看高级组件库，例如为数据表提供更复杂结构的 RichFaces，例如 example。

【讨论】：