Question

我一直很难使用Primefaces而且SO是我找到问题答案的最佳位置。

我p:dataTable有很多列，因此每个列的宽度应该都很短。对于标题，它们似乎没问题但是对于数据列，它们会分为2行或更多行，这些行不是我喜欢的。

我将第一列的宽度设置得更大，以显示数据表中的内容。标题文本很好，保持单行。但数据列对我不利。我更喜欢他们保持单线。我不希望换行。椭圆是优选的，但不是强制性的。

<p:dataTable id="searchResultTable" var="searchData" value="#{registerBean.searchDataList}"
        scrollHeight="200"
        rowIndexVar="rowIndex"
        rowKey="#{searchData.model}"
        selectionMode="single"
        selection="#{registerBean.selectedSearchData}"
        paginator="true" rows="10"
        paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
        rowsPerPageTemplate="5,10,20" resizableColumns="true">
        <p:ajax event="rowSelect" listener="#{registerBean.onSelectedSearchData}"/>
    <p:column headerText="#{registerBean.getSearchResultHeaderText(0)}"
              width="30" style="height: 10px; font-size: 8pt;">
        <h:outputText value="#{registerBean.getSearchResultText(rowIndex,0)}" />
    </p:column>
    <p:column headerText="#{registerBean.getSearchResultHeaderText(1)}"
              width="30" style="10px; height: 10px; font-size: 8pt;">
        <h:outputText value="#{registerBean.getSearchResultText(rowIndex,1)}" />
    </p:column>
    <p:column headerText="#{registerBean.getSearchResultHeaderText(2)}"
              width="30" style="10px; height: 10px; font-size: 8pt;">
        <h:outputText value="#{registerBean.getSearchResultText(rowIndex,2)}" />
    </p:column>

我为每列使用了h:outputText。我不会坚持h:outputText，我可以使用Primefaces的任何组件都可以。

提前致谢。

Answer 1

我可以找到解决方案。将下面显示的CSS添加到<p:column/>为我工作。省略号不起作用，但没有换行，没有扩大的线高。

<style type="text/css">
.singleLine
{
    text-wrap:none;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
</style>

这样做：

<p:column headerText="Something"
    width="100" styleClass="singleLine" style="height: 10px; font-size: 8pt;">
    <h:outputText value="#{something.value}" />
</p:column>

我希望它能帮助这个世界上很少有人。

如何限制p：dataTable中列的宽度，没有换行，保持单行？

1 个答案: