【コラム】
FMCakeMixのUser Guide.pdfを参考に、CakePHP x FileMakerでWebアプリの作成方法を紹介する。紹介するのは、CakePHPのPaginationという機能を使った一覧画面だ。1回目はファイルのデプロイ、データベースの準備、データベース接続設定、モデルの定義を。2回目はコントローラ・ビューの作成と実際に動作させてみるまで、3回目はコントローラでセットアップするPaginationの使い方を紹介した。今回はビューで使えるPaginationの機能について紹介する。
Paginationは一覧画面などでページャ機能を簡単に提供するためのヘルパー。一覧画面を実装する場合、ソートやページ前後の遷移など、考慮しなければならない点がおおくある。CakePHPにはPaginationとよばれるヘルパーが用意されており、デベロッパは簡単なセットアップをおこなうだけで簡単に一覧画面を実装できるようになる。
Paginationを使うための準備作業はおもに次のとおり。
前回はコントローラのセットアップまでを紹介した。今回はビューにおけるページ付け - ビューで使えるPaginationの機能について紹介しよう。
PaginatorHelperの機能は次のとおり(一部を抜粋)。
optionではPaginatorHelperが作成するリンクや表示方法をカスタマイズする。
| constants | 置換後の値 |
|---|---|
| %page% | 現在のページ |
| %pages% | 最大ページ数 |
| %count% | レコード総数 |
| %current% | 対象レコード数 |
| %start% | 表示開始レコード数 |
| %end% | 表示終了レコード数 |
counterではページの結果セット中、現在表示しているページ数やレコード総数といった情報を表示する。表示のフォーマットはoptionでカスタマイズする。
counter使用例
<p>
<?php
echo $paginator->counter();
?>
</p>
<p>
<?php
echo $paginator->counter
(
array
(
'format' => __('Page %page% of %pages%, showing %current% records out of %count% total, starting on record %start%, ending on %end%', true)
)
);
?>
</p>
<p>
<?php
echo $paginator->counter
(
array
(
'format' => __('%page% / %pages% ページ, %count% 件中, %start% - %end% 件目を表示', true)
)
);
?>
</p>
counterのformatは先述のoptionのほか、counter内で直接指定も可能。次のように表示される。
それぞれ最初のページ, 前のページ, 次のページ, 最後のページへのリンクを作成する。firstとlastには$title, $options、prevとnextにはこれに加えて$disabledTitle, $disabledOptionsと4つのパラメータが指定でき、リンクが有効/無効の場合の表示形式をカスタマイズできる。
first, prev, next, last使用例
<p>
<?php
echo $paginator->first();
echo $paginator->prev();
echo $paginator->next();
echo $paginator->last();
?>
</p>
<p>
<?php
echo $paginator->first('最初のページ', null);
echo $paginator->prev('前のページ', null, '前のページ', array('tag'=>'span'));
echo $paginator->next('次のページ', null, '次のページ', array('tag'=>'span'));
echo $paginator->last('最後のページ', null);
?>
</p>
prev, nextの第3/4引数は、ページが存在しないときに表示する文字列とオプション。次のように表示される。
numbersでは複数ページにまたがる場合の、ページ番号を作成する。セパレータや一度に表示するページ番号の数、ラップするタグなどはオプションでカスタマイズ可能。
numbers使用例
<p>
<?php
echo $paginator->numbers();
?>
</p>
このサンプルでは次のように表示される。
sortではソート用リンクを作成する。表示例については「Hello, FMCakeMix! チュートリアル(2)」を参照されたい。
「Hello, FMCakeMix! チュートリアル(2)」のビュー記述例をベースに、これらのメソッドを使用して一覧画面を再実装する。
ビュー記述例
<p style="text-align: center">
<?php
echo $paginator->counter
(
array
(
'format' => __('%page% / %pages% ページ, <span class="foundCount">%count%</span>件中、%start% - %end% 件目を表示', true)
)
);
echo '<br>';
echo $paginator->prev('<< '.__('前のページ', true), array(), null, array('class'=>'disabled', 'tag' => 'span'));
echo ' | ' . $paginator->numbers() . ' | ';
echo $paginator->next(__('次のページ', true).' >>', array(), null, array('tag' => 'span', 'class' => 'disabled'));
?>
</p>
<table cellpadding="0" cellspacing="0">
<tr>
<th>
<?php echo $paginator->sort('Title' , 'title');?>
</th>
<th>
<?php echo $paginator->sort('Author', 'author');?>
</th>
<th>
<?php echo $paginator->sort('Pages', 'number_of_pages');?>
</th>
</tr>
<?php
$i = 0;
foreach ($books as $book)
{
?>
<tr>
<td>
<?php echo $book['Book']['title']; ?>
</td>
<td>
<?php echo $book['Book']['author']; ?>
</td>
<td>
<?php echo $book['Book']['number_of_pages']; ?>
</td>
</tr>
<?php
}
?>
</table>
<p style="text-align: center">
<?php
echo $paginator->prev('<< '.__('前のページ', true), array(), null, array('class'=>'disabled', 'tag' => 'span'));
echo ' | ' . $paginator->numbers() . ' | ';
echo $paginator->next(__('次のページ', true).' >>', array(), null, array('tag' => 'span', 'class' => 'disabled'));
echo '<br>';
echo $paginator->counter
(
array
(
'format' => __('%page% / %pages% ページ, <span class="foundCount">%count%</span>件中、%start% - %end% 件目を表示', true)
)
);
?>
</p>
counter, prev, numbers, nextを使用してナビゲーションを追加した。これをWebブラウザで表示する。
ページ送り処理の実装はなかなか手間がかかるが、Paginatorを使いこなせば効率よく実装ができるようになる。マニュアルを熟読して、しっかり使いこなせるようになっておこう。
| FileMaker ProのiPhone/iPadアプリ「FileMaker Go」登場 [2010/7/21] |
| ファイルメーカー、「FileMaker カンファレンス 2010」を10月に開催 [2010/7/2] |
| ファイルメーカー、FileMakerセミナーイベントを6月に5都市で開催 [2010/4/20] |
| 「FileMaker Pro 11」発表 - グラフ作成機能やクィック検索を搭載 [2010/3/10] |
| 花粉の運び屋“マルハナバチ”の国勢調査 [18:11 5/24] |
| 「Arid5a」は自己免疫疾患を引き起こすカギ分子の可能性大 - 阪大 [17:39 5/24] |
| 岡山大、中枢神経の「ランビエ絞輪」形成機構の解明に1歩前進 [17:35 5/24] |
| 細胞間接着を担うタンパク質「クローディン」に関する発見 - 阪大など [17:32 5/24] |
| パナソニック、LEDに匹敵する照明用高効率白色有機EL素子を開発 [17:29 5/24] |
|
ガラパゴス諸島の美しさをストリートビューで - Google Official Blog [23:44 5/25] パソコン |
|
【レビュー】天板がシースルーだと何が便利か - スリムでかっこいい日本HPの複合機「HP ENVY 120」を試す [23:43 5/25] パソコン |
|
【レビュー】タブグループ機能をさらに使いやすくするFirefoxアドオン「Pano」 [22:39 5/25] パソコン |
|
ソフトバンク、「タダデコ」が6月26日にサービス終了 [22:36 5/25] 携帯 |
|
KDDI、Smart TV Box向けに「ビデオパス」提供開始 - うたパスは6月に [22:10 5/25] 携帯 |