【问题标题】:PrimeFaces datatable scrollbar positionPrimeFaces 数据表滚动条位置
【发布时间】:2012-09-11 08:39:55
【问题描述】:

如何设置primefaces数据表的滚动条位置从最后一个到第一个?

实际上,我想从下到上查看信息。以下是我的代码:

 <p:dataTable  var="c" value="#{MessagingUserBean.inboxDetails1}" scrollable="true" scrollHeight="517" liveScroll="true" emptyMessage="No Message Found"  scrollRows="8" scrollWidth="815" >

【问题讨论】:

  • 没有。我想做一个像 facebook 一样的消息传递功能。

标签: jsf-2 primefaces


【解决方案1】:

你可以尝试不使用 liveScroll,因为你不知道 dataList 的结尾。试试这个,也许这适合你的需要。这将延迟滚动到数据表的底部。

<h:form prependId="false">
          <p:dataTable id="dataTable" var="c" value="#{MessagingUserBean.inboxDetails1}" scrollHeight="517" liveScroll="true" emptyMessage="No Message Found" scrollWidth="815" >

    //Your dataTable stuff
        </p:dataTable>
    </h:form>
    <script>
        //Get the scrollheight
        var s = jQuery('#dataTable .ui-datatable-scrollable-body').prop('scrollHeight');

        //Get total size of datatable
        var o = jQuery('#dataTable .ui-datatable-scrollable-body').prop('offsetHeight');

        //calculate how many times it can scrolldown to set your timer
        var t = Math.ceil(s/o);
        //Excute scrolldown animation (max scrolldown is  scrollHeight - offsetHeight)
        $('#dataTable .ui-datatable-scrollable-body').animate({scrollTop:s-0}, t*1000);     
    </script>

【讨论】:

  • 不改变滚动条的位置,只改变条目的顺序
  • 完全正确。它不会改变位置。
  • 那么我不明白这个问题。是否要在数据表底部启动滚动条?
  • @Tankhenk 是的,我想从底部开始。
  • @Tankhenk:很棒的答案。非常感谢.. :)
【解决方案2】:

您将需要一些 javascript 来执行此操作。

var $scrollable = $(dataTableSelector).children('.ui-datatable-scrollable-body')[0];
$scrollable.scrollTop =  $scrollable.scrollHeight;

其中“dataTableSelector”是您的 primefaces 表的选择器(例如 styleClass)。

当然,这假设您显示的列表中的最后一个元素实际上是您要显示的第一个元素。

【讨论】:

    猜你喜欢
    • 2013-04-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-10-14
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多