如何阻止滚动条出现在dataTable中？

Question

我正在使用primefaces在网络应用上工作。我使用的是dataTable，每当我将鼠标移动到桌面时，底部会出现一个滚动条，偶尔会出现在右侧。我不想要或不需要这个滚动条。

＆＃13;

＆＃13;

<p:dataTable var="o" id="territoryTable" widgetVar="territoryDataTable" value="#{searchTerritory.lazyModel}" lazy="true" dynamic="true" paginator="true" paginatorPosition="bottom" rows="#{configParams['dataTable.row.default']}" styleClass="dataTableMargin"
  rowKey="#{o.id}" selectionMode="single" rowsPerPageTemplate="#{configParams['dataTable.row.values']}">

  <p:ajax event="rowSelect" listener="#{searchTerritory.onRowSelect}" />
  <p:ajax event="filter" ignoreAutoUpdate="true" />

  <p:column headerText="#{messages['territory.id']}">
    <h:outputText value="#{o.custom_id}" />
  </p:column>

  <p:column headerText="#{messages['territory.name']}">
    <h:outputText value="#{o.name}" />
  </p:column>

  <p:column headerText="#{messages['territory.description']}">
    <h:outputText value="#{o.description}" />
  </p:column>

  <p:column headerText="#{messages['status.active']}">
    <p:selectBooleanCheckbox disabled="true" value="#{o.activeFlag}" />
  </p:column>

  <p:column headerText="#{messages['territory.coordinator.TerritoryManager']}">
    <h:outputText value="#{o.territoryManager.name}" />
  </p:column>

  <p:column headerText="#{messages['territory.coordinator.status']}">
    <h:outputText value="#{o.territoryManager.activeFlag eq true ? 'Active' : 'Inactive'}" />
  </p:column>
</p:dataTable>

＆＃13;

＆＃13;

＆＃13;

有人知道如何删除它吗？

Answer 1

我建议使用纯css解决方案，只需隐藏滚动条即可。溢出的内容将被隐藏。

您需要在css中插入以下内容：

.dataTableMargin .ui-datatable-tablewrapper {
    overflow: hidden;
}

其中dataTableMargin给出了styleClass，ui-datatable-tablewrapper是数据表内容的包装。

PS：确保您的内容始终位于给定视图中。否则太大的内容将被切断。