如何对从数组创建的html表进行分页?

时间:2012-11-04 02:35:40

标签: php pagination html-table

我无法想出正确的逻辑和方法来分离我的数据并动态创建一个带分页的表。我有一个函数读取文件服务器,编译图像列表并将它们分类为这样的数组:

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

定义

*编辑** -------&gt;&gt;&gt;

因此,如果我选择Steven Liao所建议并拥有此内容的东西:

$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随页面而变化,但表格没有变化,我真的不知道这个分页代码,因为它基于Steven Liao的答案。

3 个答案:

答案 0 :(得分:1)

每页上都有$rows×$cols张图片。因此,在您的第一页$index将从0开始,下一页从1+$page×$rows×$cols开始,依此类推,其中$page是第nn页。我希望你明白这一点。

答案 1 :(得分:0)

$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>';

答案 2 :(得分:0)

jQuery DataTables:jQuery插件,基本用法非常简单:

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

除了导航和分页之外,您还可以使用数据检测和搜索框进行多列排序。支持jQuery UI样式。 (可根据需要启用/禁用功能)。

注意:您的表格必须使用theadtbody元素才能使此插件正常运行。

还有其他多个插件可用。