PrimeFaces：如何设置 p:subtable 列的宽度答案

【问题标题】：PrimeFaces: How to set the p:subtable column's widthPrimeFaces：如何设置 p:subtable 列的宽度
【发布时间】：2015-05-22 16:15:18
【问题描述】：

我有以下结构要在我的页面中呈现：

<p:dataTable value="#{bean.persons}" var="person">
    <p:subTable value="#{person.children}" var="child">
        <f:facet name="header">
            <h:outputText value="Person: #{person.name}" />
        </f:facet>
        <p:columnGroup type="header">
            <p:row>
                <p:column headerText="Name"/>
                <p:column headerText="Years" />
                <p:column headerText="Birth Date" />                
            </p:row>
        </p:columnGroup

        <p:column>
            <h:outputText value="#{child.name}" />
            <h:outputText value="#{child.years}" />
            <h:outputText value="#{child.birthDate}" />
        </p:column>
    </p:subTable
</p:dataTable

我希望它像这样打印：

但不幸的是，即使我更改了“p:column”标签中的“width”、“style”或“styleClass”属性，宽度始终是通过子表中的行宽分布的：

我该如何解决这个问题？无论如何，我可以解决这个问题吗？

【问题讨论】：

生成的html是什么样的？您可能可以使用 CSS 来定位它。

标签： java javascript css primefaces xhtml

【解决方案1】：

将style/styleClass标签放在<p:columnGroup type="header">的p:column中

使用 Primefaces 5.3、Mojarra 2.2 测试

<p:dataTable value="#{bean.persons}" var="person">
<p:subTable value="#{person.children}" var="child">
    <f:facet name="header">
        <h:outputText value="Person: #{person.name}" />
    </f:facet>
    <p:columnGroup type="header">
        <p:row>
            <p:column headerText="Name" style="width: 500px"/>
            <p:column headerText="Years" />
            <p:column headerText="Birth Date" />                
        </p:row>
    </p:columnGroup

    <p:column>
        <h:outputText value="#{child.name}" />
    </p:column>
    <p:column>
        <h:outputText value="#{child.years}" />
    </p:column>
    <p:column>
        <h:outputText value="#{child.birthDate}" />
    </p:column>
</p:subTable
</p:dataTable

【讨论】：