EC-CUBEに用意されているページ送り（ページネーション）機能を利用する
EC-CUBEにはシステム内で汎用的に利用できる機能がいろいろあるのですが、ページ送り機能についてもわざわざ自作しなくて済むようになっています。
利用するクラスは「SC_PageNavi_Ex」クラスで、これをページオブジェクト内のメンバー変数としてインスタンス化して利用します。
この記事はVer 2.12.x以降のユーザーを対象に書いています。
コンストラクタに必要なパラメーターリスト
SC_PageNavi_Exクラスをインスタンス化するには、次のような引数が必要となります。
「全データ件数」のように必須のパラメーターもあるので、データが揃っていない場合はDBから取得するなどして、利用する前に準備しておいてください。
| 引数 | 必須 | 型 | 解説 |
|---|---|---|---|
| 1 | integer | 現在のページ数番号。 デフォルトは１。 | |
| 2 | ○ | integer | データ検索等で一致した全データ件数。 |
| 3 | ○ | integer | １ページあたりのデータ表示件数。 |
| 4 | ○ | string | ページ送りのクリック時に実行するJavaScript関数名。 |
| 5 | integer | ページ送りで表示するページリンクの数。 デフォルトはNAVI_PMAX定数。 | |
| 6 | string | ページ送りリンクに付加したいURLクエリ文字列。 デフォルトは空文字列。 | |
| 7 | boolean | ページ送りリンクで番号リンクを表示するかどうか。 デフォルトはtrue。 |
SC_PageNavi_Exクラスの利用例
ページクラス側
// LC_Page_ExやLC_Page_Admin_Ex を継承した独自ページクラス内のactionメソッド
function action() {
//本当はこのような分かりにくい変数名をつけてはいけませんが、便宜上使用します。
$param1 = $_REQUEST['pageno'];
$param2 = MySearchClass::getMatchCount($_REQUEST['keyword']);
$param3 = 20;
$param4 = 'fnNaviPage';
$param5 = NULL;
$param6 = 'pageno=#page#';
$param7 = true;
$this->objNavi = new SC_PageNavi_Ex($param1,$param2,$param3,
$param4,$param5,$param6,$param7);
}
インスタンス化によって利用可能になるプロパティ
SC_PageNavi_Exインスタンスを生成すると、次のようなプロパティが利用できるようになります。 ただし、これらのプロパティについては明確な取得メソッドがなく、直接アクセスすることになります。
| プロパティ名 | 解説 |
|---|---|
| now_page | 現在のページ番号 |
| max_page | 最終のページ番号 |
| start_row | 開始レコード |
| strnavi | ページ送り文字列 |
| arrPagenavi | ページデータ参照用のハッシュ配列（後述） |
実装するに当たって、テンプレートファイルでこれらのプロパティにアクセスすることがありますが、バージョンアップなどによりプロパティ名が突如変更になる可能性があることに注意しておいてください。
arrPagenaviプロパティについて
プロパティの中でもarrPagenaviプロパティの中身はハッシュデータになっていて、次のようなキーと値が参照できます。
| キー名 | 値 |
|---|---|
| mode | モード。 常に「search」が設定される。 |
| now_page | 現在のページ番号。 |
| before | 前のページ番号。 ない場合はnow_pageと同じ値。 |
| next | 次のページ番号。 ない場合はnow_pageと同じ値。 |
| arrPageno | ページ番号が入った配列。 |
テンプレートに組み込む方法
このように設定されたSC_PageNavi_Exインスタンスはテンプレート側で「$objNavi」変数として利用できるので、以下のようにテンプレートページでプロパティを参照するなどしてページ送り表示を実現することができます。
<form name="form1" method="post" action="?">
<input type="hidden" name="<!--{$smarty.const.TRANSACTION_ID_NAME}-->" value="<!--{$transactionid}-->" />
<input type="hidden" name="pageno" value="<!--{$objNavi->now_page}-->" />
<p><span class="attention"><!--{$objNavi->all_row}-->件</span>のデータが一致しました。</p>
<div class="paging">
<ul>
<!--▼ページナビ-->
<!--{$objNavi->strnavi}-->
<!--▲ページナビ-->
</ul>
</div>
...(検索結果データの表示など)...
</form>
また、ページ送りのリンクをクリックした際にSC_PageNavi_Exインスタンス生成時に指定したJavaScript関数「fnNaviPage()」が呼び出されるようになっています。
この関数は「/js/site.js」内にあらかじめ以下のように定義されているので、特にform名を変更したりしなくても良いのであれば販売サイト・管理サイトとも、そのまま利用できます。
// ページナビで使用する。
function fnNaviPage(pageno) {
document.form1['pageno'].value = pageno;
document.form1.submit();
}
もし1ページ内で複数のページ送り機能を実装したい場合は、SC_PageNavi_Exインスタンスを複数作成し、JavaScript関数も別のものを自作してコンストラクタのパラメーターに指定することになるでしょう。
以上、お役に立ちましたでしょうか？
2013-08-22