如何爲從數組創建的html表分頁？

Question

我很難想出正確的邏輯和方法來分離我的數據並動態地創建一個分頁表。我有一個功能，讀取文件服務器，編譯圖像的列表，並將其分類成一個這樣的數組：

imagenames ([0] => apple.png [1] => banana.png [2] => carrot.png [3] => dill.png) 

我使用這個數組動態創建一個表像這樣的代碼：

echo '<table>'; 
for ($r=0; $r<$rows; $r++){ 
    echo '<tr>'; 
    for ($c=0; $c<$cols; $c++){ 
     if($index<$imagecount){ 
      echo '<td><img src="images/'.$imagenames[$index].'" ></td>'; 
      $index++; 
     } 
    } 
    echo '</tr>'; 
} 
echo '</table>'; 

如果我設置了$rows=3;和$cols=3;，我的桌子將有9個圖像的空間。如果我的數組允許說50個圖像，我將如何去分頁表，所以我有一個下一個，上一個和一個編號的菜單，以便整個表不必一次加載或忽略所有文件之外的所有文件範圍由$rows*$cols定義？

*編輯** ------- >>>

所以，如果我去的東西，史蒂芬廖建議，並有這樣的：

$size = $rows*$cols; // number of elements on page 
$min = $_GET['p']*$size; // start index in array 
$total_pages = ceil(count($imagenames)/$size); 

echo '<table class="photobox">'; 
    for ($r=0; $r<$rows; $r++){ 
     echo '<tr>'; 
     for ($c=0; $c<$cols; $c++){ 
    if($index<$imagecount){ 
     echo '<td><img src="images/'.$imagenames[$index].'" /></td>'; 
     $index++; 
    } 
     } 
     echo '</tr>'; 
    }  
echo '</table><br/><br/>'; 

// Previous 
$prev_page = max($_GET['p']-1, 0); 
echo '<a href="photobox.php?p='.$prev_page.'">Previous</a>'; 
// Each individual page number (no separators yet) 
for($i = 0; $i < $total_pages; $i++){ 
    echo '<a href="photobox.php?p='.$i.'">'.($i+1).'</a>'; 
} 
// Next 
$next_page = min($_GET['p']+1,$total_pages-1); 
echo '<a href="photobox.php?p='.$next_page.'">Next</a>'; 

這顯示錶，並創建了導航鏈接。我將如何去改變每個頁面的表格內容。導航在那裏，URL隨着頁面的變化而變化，但是表格並沒有改變，我也不太瞭解這個分頁代碼，因爲它基於史蒂文廖的答案。

Answer 1

您將有$rows×$cols每頁上的圖像數量。因此，您的第一頁$index將從0開始，在下一頁從1+$page×$rows×$cols開始依此類推，其中$page是頁數nnumber。我希望你明白這個主意。

Answer 2

$size = $row*$col; // number of elements on page 
$min = $_GET['p']*$size; // start index in array 
$total_pages = ceil(count($imagenames)/$size); // round up number of pages (stragglers get their own page) 

// Display logic here 
for($i = 0; $i < $rows; $i++){ 
    for($j = 0; $j < $cols; $j++){ 
     echo '<span>Display Logic for '.$imagenames[$min+$i*rows+$j].'</span>'; 
    } 
} 

// Previous 
$prev_page = max($_GET['p']-1, 0); 
echo '<a href="this.php?p='.$prev_page.'">Previous</a>'; 

// Each individual page number (no separators yet) 
for($i = 0; $i < $total_pages; $i++){ 
    echo '<a href="this.php?p='.$i.'">'.($i+1).'</a>'; 
} 

// Next 
$next_page = min($_GET['p']+1,$total_pages-1); 
echo '<a href="this.php?p='.$next_page.'">Next</a>'; 

Answer 3

jQuery DataTables：jQuery插件非常簡單的基本用法：

$(document).ready(function(){ 
    $('#your_table_id').dataTable(); 
}); 

除了導航和分頁你也可以得到多列與數據檢測排序和搜索框一個。支持jQuery UI樣式。 （可根據需要啓用/禁用功能）。

注意：您的表必須使用thead和tbody元素才能使此插件正常工作。

還有其他多個插件可用。