p：dataTable与f：facet name =“header”的错误样式

Question

我在<p:dataTable>中显示数据，但它显示如下

视图标记很简单：

<h:form>
    <p:dataTable id="campaignSummaryTable" var="mout" value="#{campaignSummarySearchRes.summaryList}" height="500" scrollable="true"  >
        <p:column>
            <f:facet name="header"><h:outputText value="Campaign Code"/></f:facet>
            <h:outputText value="#{mout.shortCode}"/>
        </p:column>
        <p:column>
            <f:facet name="header"><h:outputText value="Message"/></f:facet>
            <h:outputText value="#{mout.message}"/>
        </p:column>
        <p:column>
            <f:facet name="header"><h:outputText value="Option 1"/></f:facet>
            <h:outputText value="#{mout.option1}"/>
        </p:column>
        <p:column>
            <f:facet name="header"><h:outputText value="Option 2"/></f:facet>
            <h:outputText value="#{mout.option2}"/>
        </p:column>
        <p:column>
            <f:facet name="header"><h:outputText value="Option 3"/></f:facet>
            <h:outputText value="#{mout.option3}"/>
        </p:column>
        <p:column>
            <f:facet name="header"><h:outputText value="Option 4"/></f:facet>
            <h:outputText value="#{mout.option4}"/>
        </p:column>
        <p:column>
            <f:facet name="header"><h:outputText value="Other"/></f:facet>
            <h:outputText value="#{mout.other}"/>
        </p:column>
    </p:dataTable>                  
</h:form>

我如何解决这个问题？标题和内容应具有相同的列宽。

Answer 1

在列中添加style="width:125px"属性，使它们看起来像这样：

    <p:column headerText="Campaign Code" style="width:125px">
            <h:outputText value="#{mout.shortCode}" />
    </p:column>

我还将标题作为列的属性。我不知道那是否有必要，但它看起来更好。

See also PF Showcase

Answer 2

您使用的是哪个版本？

您不必在列中放置facet;每列都有headerText属性。看看这个：http://www.primefaces.org/showcase-labs/ui/datatableComplex.jsf。