2015-04-01 30 views
0

是否有一種分頁方式允許用戶輸入與Dojo分頁中的goto按鈕不相似的可用頁碼?如何在dojo中應用分頁

這裏是我的意思的例子:

在這個例子中,存在這樣用戶可以指定頁碼的文本框,之後他被帶到相應的頁面。

可以這樣做嗎?如果是這樣,你可以幫助我這個...在此先感謝。

+0

JavaScript和Dojo都可以實現。但是,沒有標準組件,還有第三方分頁組件(https://github.com/driskull/dijit-pagination-js),但不符合您的要求。 – g00glen00b 2015-04-07 13:02:57

回答

0

的script.js

function paginate(){ 

    //create pagination buttons 

    if(data.length >= 5){ 
     for(var y = 0; y < data.length/5 ; y++) { // divide by 5 to get results per page equal to 5 
      var button = document.createElement("button"); 
      button.setAttribute("id", "pagination-button" + (y+1).toString()); 
      button.setAttribute("class", "pagination-button center"); 
      button.setAttribute("onclick", "nav(id)"); 
      var text = document.createTextNode((y + 1).toString()); 
      button.appendChild(text); 
      document.body.appendChild(button); 
     } 
    } 
} 
function removeChildNodes() { 
    document.getElementById("searchResults").innerHTML = ""; 
} 
function nav(id){ 
    removeChildNodes() 
    showPages(document.getElementById(id).innerHTML); 
} 
function showPages (pageNum) { 
    //get upperbound reults 
    pageNum = parseInt(pageNum); 
    var upperBoundResults = (pageNum * 5); // gets increments of 5 per page if page 1 , 5 results 
    //get lower bound results to start at 
    var lowerBoundResults = (upperBoundResults - 5); // if page 2, lower bound is 5 upper 10 
    for(lowerBoundResults; lowerBoundResults<upperBoundResults; lowerBoundResults++) { 
     if(data[lowerBoundResults]) { 
      document.getElementById("searchResults").innerHTML += "<div class='center'>" + 
      "Name: " + data[lowerBoundResults].title  + "</div>"; 
      } else { 
       break; // breaks if no longer any results that would throw an error 
      } 
     } 
} 

showPages(1); 
paginate(); 

index.html 
    <!DOCTYPE html> 
    <html> 

    <head> 
     <link rel="stylesheet" type="text/css" href="style.css"> 

    </head> 
    <body> 
    <div id="searchResults"></div> 

    </body> 
    <script type="text/javascript" src="script.js"></script> 
    </html> 

這樣做是什麼讓一個PAGINATE按鈕,每5項。所以,在數據中創建你的JSON對象,它應該是很好的去。

+0

你能幫我一個在wcs中使用dojo的代碼嗎?這樣可以啓用gotopage文本框? – 2015-04-02 03:18:01

+1

只需將document.getelementbyid轉換爲$,dojo實際上並沒有多大作用。爲什麼它必須在Dojo中,香草JS與所有東西都兼容。 – Steve 2015-04-02 13:35:24