You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Scrollable Datatable导致SplitterPanel无法拖拽调整大小的问题求助

PrimeFaces SplitterPanel 拖拽失效问题

将设置为scrollable="true"的DataTable放入SplitterPanel后,SplitterPanel无法拖拽调整大小,即便面板为水平拆分、表格为垂直滚动的场景下,该问题依然存在。怀疑是PrimeFaces的Bug,或是遗漏了某些配置项。

技术栈

  • Java 21
  • Spring Boot 3.3.0
  • PrimeFaces 14.0.0
  • JSF 4.0.6

主视图XHTML代码(表格位于table:owner-location标签内)

<div style="height: 100%; overflow: hidden;">
    <p:splitter style="height: 100%" resizeMode="fit">
        <p:splitterPanel styleClass="align-items-center"
            size="10">
            <h:form style="height: 100%"
                id="ownerTree">
                <div class="panel-header"
                    style="display: flex;  justify-content:space-between; align-items:center">
                    <span class="ui-panel-title form-label">Owners</span>
                    <span style="display: flex; align-items:center;">
                        <tree:tree-bookmark-menu controller="#{ownerTreeController}"
                            update="@form" />
                        <p:commandButton icon="pi pi-search"
                            value="Find"
                            style="margin-left: 15px;"
                            action="#{ownerTreeController.onFind}">
                            <p:ajax event="dialogReturn"
                                listener="#{ownerTreeController.findLocationClass}"
                                update="@form" />
                        </p:commandButton>
                    </span>
                </div>
                <div style="display: flex; align-items:stretch; height: calc(100% - 60px);">
                    <tree:tree-view controller="#{ownerTreeController}"
                        update=":frmDetail" />
                </div>
            </h:form>
        </p:splitterPanel>
        <p:splitterPanel styleClass="align-items-center"
            size="90">
            <h:form id="frmDetail"
                style="overflow-y: hidden; height: 100%;">
                <p:outputPanel class="sub-toolbar"
                    style="height: 45px;"
                    id="ownerLocationsToolbar">
                    <p:commandButton styleClass="ui-button"
                        value="Select Page"
                        style="margin-right: 10px;"
                        action="#{locationOwnerTableController.onSelectPage()}"
                        update="@form" />
                    <p:commandButton styleClass="ui-button"
                        style="margin-right: 10px;"
                        value="Clear Selection"
                        action="#{locationOwnerTableController.onClearSelected()}"
                        update="@form" />
                    <p:commandButton icon="pi pi-refresh"
                        styleClass="ui-button"
                        style="margin-right: 10px;"
                        action="#{locationOwnerTableController.onFind()}"
                        update="@form" />
                    <p:commandButton value="Allocate"
                        styleClass="ui-button"
                        disabled="#{not locationOwnerTableController.canAllocate}"
                        action="#{locationOwnerTableController.allocate()}"
                        update="@form" />
                </p:outputPanel>                 
                <p:card style="overflow-y: scroll; height: calc(100% - 44px);">
                    <table:owner-location controller="#{locationOwnerTableController}" />
                </p:card>
            </h:form>
        </p:splitterPanel>
    </p:splitter>
</div>

DataTable组件代码(位于cc:implementation内)

<p:dataTable id="ownerLocationTable"
        value="#{cc.attrs.controller.lazyModel}"
        selection="#{cc.attrs.controller.selectedTableEntries}"
        selectionMode="multiple"
        rowKey="#{ownerLocation.id}"
        update="ownerLocation"
        stripedRows="true"
        rowIndexVar="rowIndex"
        widgetVar="ownerLocationTable"
        var="ownerLocation"
        rowSelectMode="add"
        paginator="true"
        paginatorPosition="bottom"
        paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks}
                                   {NextPageLink} {LastPageLink} {RowsPerPageDropdown} {RowsCount}"
        rowsPerPageTemplate="5,10,15,50,100"
        rows="15"
        scrollable="true"
        scrollHeight="auto"
        scrollWidth="auto">

已重现该问题的测试项目已准备好,恳请提供解决方案。

内容的提问来源于stack exchange,提问作者DelonPrinsloo

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.15 01:05:55