PrimeFaces datatable scrollbar position

问题

How to set a scrollbar position of primefaces datatable from last to first?

Actually, I want see the information from bottom to top. Below is my code:

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

回答1:

Well you can try to not use a liveScroll because you then don't know the end of dataList. Try this and maybe this suit your needs. This will scrolldown to the bottom of your dataTable with a delay.

<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>

回答2:

You will need some javascript to do this.

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

Where "dataTableSelector" is a selector for your primefaces table (a styleClass for example).

Of course, this assume that the last element in the list you're displaying is actually the first you want to show.

来源：https://stackoverflow.com/questions/12365873/primefaces-datatable-scrollbar-position

标签

jsf-2

primefaces