phpのページングは難しくない!シンプルに覚えるサンプル付き解説

2024年4月29日

つぶらや

こんにちは!独学プログラマー＆ライターのつぶらやです。

ページングってなんなの？
[su_spacer size=”20″]
別名はページネーション
[su_spacer size=”20″]
日本語では、ページ割だそうです。

よくWebページで見るページ番号、次へ、前へボタンなどがその機能です。

一覧表示で、沢山情報がある場合に分割して表示させる機能です。

なぜ分割させるのかといいますと、

・表示時間を短くさせる
・1ページの情報量を減らして見やすくさせる[su_spacer size=”20″]

などの効果があります。

ページングの概要がわかったところで次の疑問が浮かびませんか。

どうやって作られているのだろう。
[su_spacer size=”20″]
本日はこのページングの作り方についてお話していきます。

ページングの仕組み

以下のようなデータがあったとします。

[su_table]

本種類	本の名前
ライトノベル	ライトノベルの本
歴史	歴史の本
料理	料理の本
啓発本	啓発の本
コミック	コミックの本
推理小説	推理小説の本
フォトブック	フォトブックの本

[/su_table]

そして、以下のようにページングを表示させてみました。

【図の説明】
①7件中3件ずつ表示されています。
②現在表示中のページで、リンクはついていません。
③2ページ目と3ページ目のリンクです。

次に、上記を作成するために必要なものを説明していきます。

1ページの記事の表示数

1ページに記事を何個表示するかという事です。

今回の場合、3となります。

トータルデータ件数

表示するデータが全部で何件あるのかという事です。

今回の場合は7件です。

トータルページ数

ページの数は何ページになるのかという事です。

今回の場合は、3ページです。

現在のページ番号

今表示しているページ番号は何ページ目になるのかという事です。

今回の場合は、1ページ目です。

最低限この4つがあればよいです。

この4つをどのように使用するのか説明します。

ページングで必要な事は、データの表示(図の①)とページへのリンク(図の②と③)作成です。

データの表示は、全データの何件目から何件目を取得すればよいかがわかればいいのです。

全データ7件(トータルデータ件数)で2ページ目を表示の場合、3件(記事の表示数)ずつ表示の2ページ目なので4件目～6件目のデータを取得するという事が分かるのです。

ページのリンクは、トータルページ数分作ればよいです。

図の例の場合全3ページなので、1、2、3とページのリンクが出来ます。

ただし、現在のページである1にはリンクは貼られていません。

ページングの仕組み、なんとなくわかって頂けたでしょうか。

ページングの基本編

それでは、基本編として実際のコードをサンプルで書いてみたいと思います。

前項目のデータ例を元にtest.phpを作成します。

<?php
define('MAX','3'); // 1ページの記事の表示数

$books = array( // 表示データを配列に入れる
          array('book_kind' => 'ライトノベル', 'book_name' => 'ライトノベルの本'),
          array('book_kind' => '歴史', 'book_name' => '歴史の本'),
          array('book_kind' => '料理', 'book_name' => '料理の本'),
          array('book_kind' => '啓発本', 'book_name' => '啓発の本'),
          array('book_kind' => 'コミック', 'book_name' => 'コミックの本'),
          array('book_kind' => '推理小説', 'book_name' => '推理小説の本'),
          array('book_kind' => 'フォトブック', 'book_name' => 'フォトブックの本'),
            );
            
$books_num = count($books); // トータルデータ件数

$max_page = ceil($books_num / MAX); // トータルページ数※ceilは小数点を切り捨てる関数
 
if(!isset($_GET['page_id'])){ // $_GET['page_id'] はURLに渡された現在のページ数
    $now = 1; // 設定されてない場合は1ページ目にする
}else{
    $now = $_GET['page_id'];
}

$start_no = ($now - 1) * MAX; // 配列の何番目から取得すればよいか

// array_sliceは、配列の何番目($start_no)から何番目(MAX)まで切り取る関数
$disp_data = array_slice($books, $start_no, MAX, true);

foreach($disp_data as $val){ // データ表示
    echo $val['book_kind']. '　'.$val['book_name']. '<br />';
}

for($i = 1; $i <= $max_page; $i++){ // 最大ページ数分リンクを作成
    if ($i == $now) { // 現在表示中のページ数の場合はリンクを貼らない
        echo $now. '　'; 
    } else {
        echo '<a href='/test.php?page_id='. $i. '')>'. $i. '</a>'. '　';
    }
}

?>

[su_spacer size=”20″]

ポイントは現在のページを$_GET[‘page_id’]で取得する部分です。

/test.php?page_id=1

[su_spacer size=”20″]
上記のようにURLに渡します。

そしてプログラム内では、$_GET[‘page_id’]で1という値を取得できます。

基本編は以上です。

ページングの応用編

応用として、次へ、前への表示と件数表示を行ってみます。

以下のようなイメージです。

①全データ数が表示されています。
②前へ、次へボタンが表示されています。

それでは前項で使用したtest.phpを修正していきます。

<?php
define('MAX','3');
$books = array(
          array('book_kind' => 'ライトノベル', 'book_name' => 'ライトノベルの本'),
          array('book_kind' => '歴史', 'book_name' => '歴史の本'),
          array('book_kind' => '料理', 'book_name' => '料理の本'),
          array('book_kind' => '啓発本', 'book_name' => '啓発の本'),
          array('book_kind' => 'コミック', 'book_name' => 'コミックの本'),
          array('book_kind' => '推理小説', 'book_name' => '推理小説の本'),
          array('book_kind' => 'フォトブック', 'book_name' => 'フォトブックの本'),
            );
            
$books_num = count($books);
$max_page = ceil($books_num / MAX);
 
if(!isset($_GET['page_id'])){
    $now = 1;
}else{
    $now = $_GET['page_id'];
}

$start_no = ($now - 1) * MAX;

$disp_data = array_slice($books, $start_no, MAX, true);

foreach($disp_data as $val){
    echo $val['book_kind']. '　'.$val['book_name']. '<br />';
}

echo '全件数'. $books_num. '件'. '　'; // 全データ数の表示です。

if($now > 1){ // リンクをつけるかの判定
    echo '<a href='/paging.php?page_id='.($now - 1).'')>前へ</a>'. '　';
} else {
    echo '前へ'. '　';
}

for($i = 1; $i <= $max_page; $i++){
    if ($i == $now) {
        echo $now. '　'; 
    } else {
        echo '<a href='/test.php?page_id='. $i. '')>'. $i. '</a>'. '　';
    }
}

if($now < $max_page){ // リンクをつけるかの判定
    echo '<a href='/paging.php?page_id='.($now + 1).'')>次へ</a>'. '　';
} else {
    echo '次へ';
}

?>

[su_spacer size=”20″]

ポイントとしては次へや前へは、表示しているページによってリンクをつけるかの判定が必要になります。

前へを押して、1ページより前に移動することはできません。

応用編まで理解できたら、もうページングは怖くありませんね!