jQuery Paginierung Plugin

Question

Hoffentlich ist dies etwas, das leicht zu beheben ist. Ich habe ein kleines Problem mit dem jQuery Pagination Plugin.

Im Wesentlichen versuche ich nur eine PHP-Datei zu laden und dann die Ergebnisse zu paginieren. Ich versuche, von ihrem Beispiel abzurücken, aber ich gebe nicht die Ergebnisse, nach denen ich suche.

Hier ist das JavaScript:

function pageselectCallback(page_index, jq){ 
      var new_content = $('#hiddenresult div.result:eq('+page_index+')').clone(); 
      $('#Searchresult').empty().append(new_content); 
      return false; 
     } 
     function initPagination() { 
      var num_entries = $('#hiddenresult div.result').length; 
      // Create pagination element 
      $("#Pagination").pagination(num_entries, { 
       num_edge_entries: 2, 
       num_display_entries: 8, 
       callback: pageselectCallback, 
       items_per_page:3 
      }); 
     }  
     $(document).ready(function(){  
      $('#hiddenresult').load('load.php', null, initPagination); 
     });  

mein HTML Hier ist (nach dem PHP geladen ist):

 <div id="Pagination" class="pagination"> </div> 
     <br style="clear:both;" /> 
     <div id="Searchresult"> </div> 

     <div id="hiddenresult" style="display:none;"> 
     <div class="result">Result #1</div> 
     <div class="result">Result #2</div> 
     <div class="result">Result #3</div> 
     <div class="result">Result #4</div> 
     <div class="result">Result #5</div> 
     <div class="result">Result #6</div> 
     <div class="result">Result #7</div> 
     </div> 

Grundsätzlich versuche ich, "3" Artikel pro Seite zu zeigen, aber diese funktioniert nicht. Ich nehme an, dass ich irgendwo in meinem JS eine for-Schleife erstellen muss, aber ich bin verwirrt, wie das geht. The documentation can be found here.

Answer 1

Sie müssen nicht einmal eine for-Schleife verwenden, verwenden Sie einfach die slice() Methode von jQuery und ein wenig Mathematik.

Ich habe eine funktionierende Demo auf JS Bin gehostet: http://jsbin.com/upuwe (Editierbare über http://jsbin.com/upuwe/edit)

Hier ist der modifizierte Code:

var pagination_options = { 
    num_edge_entries: 2, 
    num_display_entries: 8, 
    callback: pageselectCallback, 
    items_per_page:3 
} 
function pageselectCallback(page_index, jq){ 
    var items_per_page = pagination_options.items_per_page; 
    var offset = page_index * items_per_page; 
    var new_content = $('#hiddenresult div.result').slice(offset, offset + items_per_page).clone(); 
    $('#Searchresult').empty().append(new_content); 
    return false; 
} 
function initPagination() { 
    var num_entries = $('#hiddenresult div.result').length; 
    // Create pagination element 
    $("#Pagination").pagination(num_entries, pagination_options); 
}