2017-04-25 182 views
0

我正在使用YUI Paginator用於分頁的API,我需要顯示屏幕上的總頁數。我看到在API中有一個函數getTotalPages(),但我不確定如何使用它,沒有足夠的文檔。另外看過其他文檔後,我嘗試使用{totalPages},但沒有奏效。 有人能幫我解決這個問題嗎?提前致謝!! 以下是我正在使用的代碼片段。請參考模板對象從配置:如何顯示YUI Paginator中的頁面總數?

config = { 
       rowsPerPage: 100, 

       template : 
        '<p class="klass">' + 

         '<label>Total pages: {totalPages}</label>'+ 
         '<label>Page size: {RowsPerPageDropdown}</label>'+ 
        '</p>', 
       rowsPerPageDropdownClass : "yui-pg-rpp-options", 
       rowsPerPageOptions : [ 
            { value : 100 , text : "100" }, 
            { value : 250 , text : "250" }, 
            { value : 500 , text : "500" }, 
            { value : 1000 , text : "1000" }, 
            { value : tstMap[tabName].length , text : "All" } 
           ], 
      };                
var myPaginator = new YAHOO.widget.Paginator(config); 

回答

1

的分頁程序實用,可以顯示一個項目或一組取決於你想在同一時間顯示的項目數量的項目。

Paginator的主要功能包含在paginator-core中,並混合到paginator中以允許paginator添加額外功能,同時保持核心功能不變。這允許paginator-core保持可用於以後的使用或孤立使用,如果它是唯一您需要的部分。

由於Paginator可能包含大量接口,因此Paginator不包含任何可以使用的UI。但是,Paginator可以在任何基於Based的模塊(如Widget)中使用,方法是在Paginator中擴展所需的類並混合。這顯示在以下示例中:

YUI().use('paginator-url', 'widget', function (Y){ 
      var MyPaginator = Y.Base.create('my-paginator', Y.Widget, [Y.Paginator], { 

       renderUI: function() { 
        var numbers = '', 
         i, numberOfPages = this.get('totalPages'); 

        for (i = 1; i <= numberOfPages; i++) { 
         // use paginator-url's formatUrl method 
         numbers += '<a href="' + this.formatUrl(i) + '">' + i + '</a>'; 
        } 

        this.get('boundingBox').append(numbers); 
       }, 

       bindUI: function() { 
        this.get('boundingBox').delegate('click', function (e) { 
         // let's not go to the page, just update internally 
         e.preventDefault(); 
         this.set('page', parseInt(e.currentTarget.getContent(), 10)); 
        }, 'a', this); 

        this.after('pageChange', function (e) { 
         // mark the link selected when it's the page being displayed 
         var bb = this.get('boundingBox'), 
          activeClass = 'selected'; 

         bb.all('a').removeClass(activeClass).item(e.newVal).addClass(activeClass); 
        }); 
       } 

      }); 

      var myPg = new MyPaginator({ 
          totalItems: 100, 
          pageUrl: '?pg={page}' 
         }); 

      myPg.render(); 
     }); 
相關問題