ページングの仕組み・作り方

  • 2021.10.17
  • PHP
ページングの仕組み・作り方

ページングとは

簡単に言うと、1ページに表示する内容を制限して、表示をするものになります。

ページングの作り方は、以下の通りに作成していきます。

コントローラー側での流れ

①対象のDBを全件取得し、配列に格納

$customerObj = ORM::for_table(‘customer’)->find_array();

②input “hidden”で送られたページ番号を取得

$pageselect = isset($_POST[‘pageselect’]) ? $_POST[‘pageselect’] : 1; //現在のページ数取得

③⑴で取得した配列をcount();を使い配列のキーを数える
※view側の「全◯件」の部分にあたる

$listMaxCount = count($customerObj); //表示件数

④⑴の配列を5件ずつに分割(array_chunkを5にする)
※1~10のキーを、1の中に1〜5、2の中に6〜10の形になる。

$listArr = array_chunk($customerObj, 5); //5件づつに分割

⑤listArr配列のキーにPOSTで取得したページ番号を入れる
ただし、配列は0から始まるため、−1とすることで配列のキーを合わせることができ取得が可能。

$listArrView = isset($listArr[$pageselect – 1]) ? $listArr[$pageselect – 1] : ”; //一覧に表示するリスト

⑥listArrの配列のキーのみを取得をし、配列に格納

$listPageList = array_keys($listArr); //ページ選択する関数の引数

⑦キーのみを取得した配列を、foreachにて回して、+1をし、optionに入れる
※なぜ、+1するかというと、配列は0から始まるかである。

function paging_pagesekect($listPageList, $pageselect)
{

echo “<select id=’pageselect_base’ name=”>”;
foreach ((array)$listPageList as $pageNo) {
$page = $pageNo + 1;
if ($page == $pageselect) {
echo “<option value=’$page’ selected>$page</option>”;
} else {
echo “<option value=’$page’>$page</option>”;
}
}
echo “</select>”;
}

コントローラー側の処理コードまとめ

/******************************
* ページング処理
******************************/
$pageselect = isset($_POST[‘pageselect’]) ? $_POST[‘pageselect’] : 1; //現在のページ数取得
$listMaxCount = count($customerObj); //表示件数
$listArr = array_chunk($customerObj, 5); //5件づつに分割
$listArrView = isset($listArr[$pageselect – 1]) ? $listArr[$pageselect – 1] : ”; //一覧に表示するリスト
$listPageList = array_keys($listArr); //ページ選択する関数の引数

viewでの流れ

① コントローラーで全件のキーを数えた$listMaxCountを表示します。
そして、paging_pagesekect();の関数に、引数を2つセットします。

<div class=”item d-flex search-mr”>
<div class=””>全 <?php echo $listMaxCount; ?> 件 | </div>
現在<?php paging_pagesekect($listPageList, $pageselect); ?>ページ
</div>

② コントローラーで作成した⑹の配列と、POSTで受け取ったページ番号を引数にて受け取ります。
配列をforeahで回して、$pageNoに+1します。(配列が0から始まるから)
ifにて、選択したページ番号を比較し、表示し、正しい場合は、selectedをつけます。

function paging_pagesekect($listPageList, $pageselect)
{

echo “<select id=’pageselect_base’ name=”>”;
foreach ((array)$listPageList as $pageNo) {
$page = $pageNo + 1;
if ($page == $pageselect) {
echo “<option value=’$page’ selected>$page</option>”;
} else {
echo “<option value=’$page’>$page</option>”;
}
}
echo “</select>”;
}

③jqueryにて、セレクトボックスのページ番号が変更されたら処理を行う。

$(document).on(‘change’, ‘#pageselect_base’, function() {
});

④セレクトボックスの選択したページ番号を取得

var pageno = $(this).val();

⑤取得したページ番号をval();にて、input “hidden”に持たせる

<input id=’search_pageselect’ type=’hidden’ name=’pageselect’ value='<?php echo $pageselect; ?>’>

⑥post or get にてフォーム送信(submit();する)

$(‘#search_pageselect’).val(pageno);
$(‘#search_form’).submit();

view側での処理コードまとめ

//ーーーーーーーーーーーーーーーーーー
//PHP
//ーーーーーーーーーーーーーーーーーー
//セレクトボックス
function paging_pagesekect($listPageList, $pageselect)
{echo “<select id=’pageselect_base’ name=”>”;
foreach ((array)$listPageList as $pageNo) {
$page = $pageNo + 1;
if ($page == $pageselect) {
echo “<option value=’$page’ selected>$page</option>”;
} else {
echo “<option value=’$page’>$page</option>”;
}
}
echo “</select>”;
}
//ーーーーーーーーーーーーーーーーーー
//jquery
//ーーーーーーーーーーーーーーーーーー// ページング
// selectboxにてページ番号を取得し、その値をhiddenに入れる。その値を、postとして値を送信
$(document).on(‘change’, ‘#pageselect_base’, function() {
var pageno = $(this).val();
$(‘#search_pageselect’).val(pageno);
$(‘#search_form’).submit();
});