P:数据表从支持Bean插入后向下滚动



我需要在将记录添加到列表后滚动数据表。我有一个数据表:

<p:scrollPanel id="tablewindowscroll" mode="native">
<p:dataTable  scrollable="true" emptyMessage="" id="tablewindowwindow" style="width: 100%; height: 100%" var="msg" value="#{dtBasicView.messages}" rowStyleClass="#{msg.direction eq 0 ? 'stylequery' : 'styleresponse'}" styleClass="borderless">

</p:dataTable>
</p:scrollPanel>
<p:poll update=":j_id0:tablewindow" interval="2"/>

在按钮上单击im将记录添加到此列表(在支持Bean中使用经典的List.add方法(。如何强制数据表在列表更新后从支持 bean 滚动到最后一个元素?

我试过了:

function scrollToBottom() {
$('.ui-datatable-scrollable-body').scrollTop(100000)
}

但它不能通过调用来工作:

RequestContext.getCurrentInstance().execute("scrollToBottom();");

并使用:

<p:ajax update="myDataTable" oncomplete="scrollToBottom()"/>

我需要从支持bean重新点亮List.add的事件,但我知道这样的事件不存在

修改列表后,如何将数据表从支持Bean滚动到底部?

最好的问候和感谢!

你可以从 bean 调用 javascript,它有你想要选择的表大小和索引项的参数。因此,如果要选择最后一项,只需在两个参数中传递表大小即可。

PrimeFaces.current().executeScript("scroll(" + table.size() + "," + tableIndex + ");");
function scroll(sizeOfTable, index) {
var bucketHt = $("#formID\:tableID .ui-datatable-scrollable-body").height();
var scrollHt = $("#formID\:tableID .ui-datatable-scrollable- 
body").prop("scrollHeight");
var itemHt = parseInt(scrollHt) / parseInt(sizeOfTable);
var noItemsInBucket = parseInt(bucketHt) / parseFloat(itemHt);
var itemNo = parseInt(index) + 1;
var targetBucket = parseInt(itemNo) / parseFloat(noItemsInBucket);
var halfBucketHt = parseInt(bucketHt) / 2;
var scrollPos = 
(parseInt(bucketHt) * (parseFloat(targetBucket) - 1)) + parseFloat(halfBucketHt);
var scrollPosInt = Math.round(parseFloat(scrollPos));
$('#formID\:tableID .ui-datatable-scrollable- 
body').animate({scrollTop:scrollPosInt});
}

最新更新