我有一个带有素数的数据表:

<p:dataTable var="wapsoplandtl" id="wapsoplandtlList" widgetVar="wapsoplandtlList" value="#{exportController.wapsoplandtls}"
                 paginator="true" rows="50" scrollable="true" scrollWidth="2500px;" styleClass="borderless"
                 paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {CurrentPageReport}"
                 currentPageReportTemplate="{startRecord} - {endRecord} of {totalRecords}" paginatorPosition="bottom"
                 rowsPerPageTemplate="10,25,50" rowKey="#{wapsoplandtl.dtlsys}">


并产生这样的东西:

css - p:可滚动内容的数据表-LMLPHP
css - p:可滚动内容的数据表-LMLPHP

如您所见,它具有scrollwidth属性,但是标题已滚动到最右边。我只想滚动数据表的内容,而不要滚动页眉和页脚(分页)。谁能帮我?

最佳答案

这只能通过CSS来完成,忘记<p:datatable>组件的scrollable属性,显然它将始终溢出整个表,而不仅仅是内容。

在这种情况下,请执行以下操作:


scrollable组件中删除scrollWidth<p:datatable>属性;
styleClass<p:datatable>属性中包含另一个CSS类(任何名称,但保留该名称以供以后使用,在这种情况下,我将使用名称“ overflow-content”);
在页面中包含以下CSS规则:


--

.overflow-content .ui-datatable-tablewrapper table {
    overflow: auto;
    width: 2500px;
}


结果将是这样的:
css - p:可滚动内容的数据表-LMLPHP

07-24 09:48
查看更多