WHAT'S NEW?
Loading...

CakePHP2.0にSearch Pluginをいれてラクラク検索しよう【1/2】

, , , , ,
■CakePHPの2.0ってところがミソ

昨年は『CakePHP1.3にSearch Pluginをいれてラクラク検索しよう』という記事を、２回にわけてお伝えしたんだけど、まぁ別にいちいち見なおさないで良いよ。

でもリンク貼っとくから、気になって眠れない人や、全国の俺ファンの女子高生は、ここからすすむことができるんだ。夜も安心。


あくまで個人的な感覚でしか無いけど、俺的には、もはや時代は2.0っぽさが満開だと思うわけよ。こら。

とは言っても決してWeb2.0ではない。Webなんかどんなバージョニングしているのか謎すぎて、屁で空飛べるくらいどうでもいい。

何が2.0かというと、タイトル見ればいーじゃん！
そう、俺達の大好きな、あのCakePHPの2.0だよ！ブタ野郎！！！



というわけで、最近CakePHP2.0ばっかりいじっている俺が、つい最近まで書いていたCakePHP1.3の記事を、CakePHP2.0でやってみようって話。その１回目。よかったね。

使ってるバージョンはCakePHP2.0.5。このバージョンで、CakeDCのSearchプラグインを使おうぜって話だ。


早速行ってみよう。

■CakePHPをデプロイしておく

動くようにしておいていただきたい。
ブラウザで見れればいいって意味で。

CakePHP2.0はここから落とせるよ。
俺が落としたバージョンは2.0.5だ。

http://cakephp.jp/

■Searchプラグインをインストール

まずはダウンロードだ。
ダウンロード元はこちらのGithub。

https://github.com/CakeDC/Search

前回もGithubだったから、前回試してみた人は安心してダウンロードすることができるけど、たかだかダウンロードで安心もクソもねぇでやんす。

とっとと落とすと良いよ。

でも１個だけ注意が必要かもね。
ページの右側にこんなのがある。


ここが2.0になってないと、もしかしたら君は1.3用のSearchプラグインを落としてしまうかもしれないんだ。

だからこんな感じに変えておくと、寝覚め良いよ。


そもそもバージョンは2.0で説明しているのに、使ってるプラグインのバージョンが1.3だから動かないとか、エラーがでるとか、そんな話は里のおふくろにでもメールして、返事が来るまで風呂にでも入ってろといいたいけど、俺もうっかりさんの代表みたいなもんだし、よくやるパターンなので、このように親切に書いておいたから、迂闊でやんちゃな君でももう大丈夫だよね。

2.0はいろいろなフォルダが大文字から始まるCamelCaseになっているので、以下のような大文字から始まるフォルダの階層構造になっていればもう、大丈夫。


当然、『Current branch』がmasterなのに、ちゃんとフォルダが大文字から始まっていたなら、それはそれで素直にダウンロードすればいいと思うよ。

今回はこんなファイル名でダウンロードできた。

CakeDC-search-1.1-20-g98da0a6.zip

ダウンロードしたzipファイルは解凍しよう。
別に解凍しなくてもいいよ。先に進まないだけだから。

解凍したら、今回はこんな感じになっていた。
.
├── Controller
│   └── Component
│       └── PrgComponent.php
├── Locale
│   ├── deu
│   │   └── LC_MESSAGES
│   │       └── search.po
│   ├── fre
│   │   └── LC_MESSAGES
│   │       └── search.po
│   ├── por
│   │   └── LC_MESSAGES
│   │       └── search.po
│   ├── rus
│   │   └── LC_MESSAGES
│   │       └── search.po
│   ├── search.pot
│   └── spa
│       └── LC_MESSAGES
│           └── search.po
├── Model
│   └── Behavior
│       └── SearchableBehavior.php
├── Test
│   ├── Case
│   │   ├── AllSearchPluginTest.php
│   │   ├── Controller
│   │   │   └── Component
│   │   │       └── PrgComponentTest.php
│   │   └── Model
│   │       └── Behavior
│   │           └── SearchableBehaviorTest.php
│   └── Fixture
│       ├── ArticleFixture.php
│       ├── PostFixture.php
│       ├── TagFixture.php
│       └── TaggedFixture.php
├── license.txt
└── readme.md

いちいち中身は全部調べないで良いとはおもうけど、前回書いておいたから今回も書いてみた。ただtreeコマンド使いたかっただけという話もある。

ではインストールしよう。

フォルダ名を『CakeDC-search-98da0a6』から『Search』に変更し、CakePHPの『app/Plugin』の中にフォルダごと入れる。インストールはこれで完了だ。

■モデルをつくろう

今回も、UserモデルとProfileモデルで、モデルをまたいだ検索をページネーションで再現してみようと思う。

要するに、検索結果を維持したままページネーションでページをジャンプするということだ。
1.3と2.0では結構違うので、そこんとこよろしく。

まずはモデルだが、以下の構造でテーブルを作っておくと良い。
view plainprint?
  1. CREATE TABLE IF NOT EXISTS `profiles` (  
  2.   `id` int(5) NOT NULL AUTO_INCREMENT,  
  3.   `user_id` int(5) NOT NULL,  
  4.   `nickname` varchar(32) NOT NULL,  
  5.   `gender` tinyint(1) NOT NULL,  
  6.   `birthday` date NOT NULL,  
  7.   `created` datetime NOT NULL,  
  8.   `modified` datetime NOT NULL,  
  9.   PRIMARY KEY (`id`),  
  10.   KEY `user_id` (`user_id`,`nickname`,`gender`,`birthday`),  
  11.   KEY `modified` (`modified`)  
  12. ) ENGINE=InnoDB  DEFAULT CHARSET=utf8;  
  13.   
  14. CREATE TABLE IF NOT EXISTS `users` (  
  15.   `id` int(5) NOT NULL AUTO_INCREMENT,  
  16.   `username` varchar(64) NOT NULL,  
  17.   `password` varchar(64) NOT NULL,  
  18.   `created` datetime NOT NULL,  
  19.   `modified` datetime NOT NULL,  
  20.   PRIMARY KEY (`id`),  
  21.   KEY `username` (`username`,`password`)  
  22. ) ENGINE=InnoDB  DEFAULT CHARSET=utf8;  

データは以下のSQLを使うと楽だよ。
view plainprint?
  1. INSERT INTO `profiles` (`id`, `user_id`, `nickname`, `gender`, `birthday`, `created`, `modified`) VALUES  
  2. (1, 1, 'マッキー太郎', 1, '1990-10-01', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  3. (2, 2, '倍アグラン', 1, '1980-05-04', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  4. (3, 3, 'エキサイト多恵子', 2, '1992-12-08', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  5. (4, 4, '史彦パインステート', 1, '1965-11-24', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  6. (5, 5, 'Yas-Kaz', 1, '1984-09-21', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  7. (6, 6, 'ウッキー氏田', 2, '1999-08-08', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  8. (7, 7, 'リック', 2, '1996-03-30', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  9. (8, 8, 'puripuri-chan', 2, '1984-12-15', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  10. (9, 9, 'チョーサンピル', 1, '1989-05-14', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  11. (10, 10, '道端御三郎', 1, '1963-01-24', '2011-11-03 18:44:32', '2011-11-03 18:44:32');  
  12.   
  13. INSERT INTO `users` (`id`, `username`, `password`, `created`, `modified`) VALUES  
  14. (1, 'taroh@asdf.com', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  15. (2, 'jiro@qwer.net', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  16. (3, 'yamada.haruko@example.co.jp', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  17. (4, 'jimmy@ledzeppelin.com', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  18. (5, 'james@metallica.co.jp', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  19. (6, 'saburo@zcxv.tv', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  20. (7, 'sonofabitch@fxxkyou.com', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  21. (8, 'youaremydestiny@not.com', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  22. (9, 'titty.twister@fromdusktilldown.com', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32'),  
  23. (10, 'myfriends@was.gone.com', '0dedc1e879a73184aaaf574e95436e80d95bf563', '2011-11-03 18:44:32', '2011-11-03 18:44:32');  

データベースにテーブルを作ったら、今度はモデルファイルだ。

app/Model/User.php
view plainprint?
  1. class User extends AppModel {  
  2.   public $name = 'User';  
  3.   
  4.   // 検索プラグイン  
  5.   public $actsAs = array('Search.Searchable');  
  6.   
  7.   // アソシエーション  
  8.   public $hasOne = array(  
  9.     'Profile' => array(  
  10.       'className'  => 'Profile',  
  11.       'foreignKey' => 'user_id',  
  12.       'conditions' => null,  
  13.       'fields'     => null,  
  14.       'dependent'  => true,  
  15.     ),  
  16.   );  
  17. }  

今回使うプラグインを、actsAsプロパティにセットしておく。
アソシエーションはUserに対して１つのProfileを持たせるので、hasOneとしておいた。
ここで躓く人はいないと思うので、次に行くよ。

■コントローラをつくろう

次はコントローラだ。


app/Controller/UsersController.php
view plainprint?
  1. class UsersController extends AppController {  
  2.   
  3.   public $name = 'Users';  
  4.   public $uses = array('User', 'Profile');  
  5.     
  6.   public function index()  
  7.   {  
  8.     $this->set('users', $this->User->find('all'));  
  9.   }    
  10.   
  11. }  

ファイル名に気をつけるんだ。2.0からは、クラス定義されたファイルのファイル名は大文字から指定するというルールになっている。

オブジェクト指向っぽいかんじでウハウハだよね。
ウハウハしない人は、嘘でもいいからウハウハしておくと、このあとも引き続き愉快な気分を満喫できるのでおすすめだ。

そしてこのコントローラは短いから、特に説明はいらないかな。
いらないね。だからしない。

■ビューをつくろう

ビューも意外に簡単に作っておく。

app/Views/Users/index.ctp
view plainprint?
  1. <table>  
  2. <tr>  
  3.   <th>ID</th>  
  4.   <th>ユーザID</th>  
  5.   <th>ニックネーム</th>  
  6.   <th>作成日</th>  
  7.   <th>更新日</th>  
  8. </tr>  
  9. <?php foreach($users as $user):?>  
  10. <tr>  
  11.   <td><?php echo $user['User']['id']?></td>  
  12.   <td><?php echo $user['User']['username']?></td>  
  13.   <td><?php echo $user['Profile']['nickname']?></td>  
  14.   <td><?php echo $user['User']['created']?></td>  
  15.   <td><?php echo $user['User']['modified']?></td>  
  16.   </tr>  
  17. <?php endforeach?>  
  18. </table>  

1.3と違うところがある。2.0ではechoのエイリアスであるe()が使えなくなった。なので、いちいちechoしている。気をつけろ！！

■ブラウザで見てみよう

上記設定をし終わったあと、ブラウザで閲覧んすると、こんなふうになったはずだ。


なんの変哲もない普通のインデックス。一覧ページ。リスト。

■検索フォームをつけよう

次にこの一覧の上に、検索フォームをつけてみよう。
検索フォームはエレメントで作っておいて、それをindex.ctpで読み込む形にしておく。

app/View/Elements/searchForm.ctp
view plainprint?
  1. <?php echo $this->Form->create('User', array('url' => '/users/index'))?>  
  2.   
  3. <fieldset>  
  4.   <legend>Search or Die!</legend>  
  5.   <dl>  
  6.     <dt><label>ユーザID</label></dt>  
  7.     <dd><?php echo $this->Form->input('id', array(  
  8.       'type' => 'text', 'div' => false, 'label' => false))?></dd>  
  9.     <dt><label>ユーザ名</label></dt>  
  10.     <dd><?php echo $this->Form->input('username', array(  
  11.       'type' => 'text', 'div' => false, 'label' => false ))?></dd>  
  12.     <dt><label>ニックネーム</label></dt>  
  13.     <dd><?php echo $this->Form->input('nickname', array(  
  14.       'type' => 'text', 'div' => false, 'label' => false ))?></dd>  
  15.   </dl>  
  16.   
  17.   <?php echo $this->Form->submit('検索', array('div' => false, 'escape' => false))?>  
  18.   
  19. </fieldset>  
  20.   
  21. <?php echo $this->Form->end()?>  

これを読み込むために、index.ctpも若干変更を加えよう。
tableタグの上に以下を追記だ。
view plainprint?
  1. <?php echo $this->element('searchForm')?>  

これで画面はこんなふうになったはずだ。


ようやくここまでたどり着いた。
この状態で、
  1. ページャ機能を使う
  2. 検索結果もページャに反映
ということがやりたいわけだ。
この2の部分を、Searchプラグインで気軽にやっちまおうぜ、というのがこの記事の趣旨。

■ページャをつけよう

まずはページャだ。
今回データが10件しか入ってないので、１ページ20件表示のデフォルト設定だと、検索結果がかならず１ページで完結してしまう。
１ページ３件表示にすれば、少なくとも３~４ページは稼げるので、上記１と２の連携もテストしやすいというもの。

それからジャンプリンクの設定をプリフィルタでやっておきたいので、beforeFilterメソッドを作成し、その中にpager_numbersというビュー変数を使える設定をしておこう。

というわけで、まずはコントローラにページャの設定を書いておこう。

app/Controller/UserController.php
view plainprint?
  1. public function beforeFilter()  
  2. {  
  3.   // ページャ設定  
  4.   $pager_numbers = array(  
  5.     'before' => ' - ',  
  6.     'after'=>' - ',  
  7.     'modulus'=> 10,  
  8.     'separator'=> ' ',  
  9.     'class'=>'pagenumbers'  
  10.   );  
  11.   $this->set('pager_numbers', $pager_numbers);  
  12. }  
  13.   
  14. public function index()  
  15. {  
  16.   $this->paginate = array(  
  17.     'limit' => 3  
  18.   );  
  19.   
  20.   $this->set('users', $this->paginate('User'));  
  21. }  

indexアクションの中身をページャに変更させ、limitに３を指定してみた。
これで１ページ３件までとなるわけだ。


３件にはなったけど、ジャンプリンクがないからページ移動ができんばい！
となるので、ページャも作ってしまおう。

ページャは一覧の上下に付けたいから、同じ内容を二箇所に書くのはよろしく無いので、こちらもエレメントとして作っておくことにする。

app/View/Elements/pager.ctp
view plainprint?
  1. <div class="pagers">  
  2.   <?php echo ($this->Paginator->hasPrev())?$this->Paginator->first('&laquo;', array('class'=>'first', 'escape'=>false)):'<span class="disabled">&laquo;</span>'?>  
  3.   <?php echo $this->Paginator->prev('&lsaquo;', array('escape' => false), null, array('class'=>'disabled', 'tag' => 'span', 'escape' => false));?>  
  4.   <?php echo $this->Paginator->numbers($pager_numbers);?>  
  5.   <?php echo $this->Paginator->next('&rsaquo;', array('escape' => false), null, array('class' => 'disabled', 'tag' => 'span', 'escape' => false));?>  
  6.   <?php echo ($this->Paginator->hasNext())?$this->Paginator->last('&raquo;', array('class'=>'last','escape'=>false)):'<span class="disabled">&raquo;</span>'?>  
  7. </div>  

なんどか試しては見たんだけど、$Paginator->first()、$Paginator->last()は、ない場合nullになってしまうのは1.3から変わってないようだ。これは残念。

したがって、$Paginator->hasPrev()、$Paginator->hasNext()で判定させている状態。

さて、このページャをindex.ctpから読み込ませるので、tableタグの上下に以下を追記しておく。
view plainprint?
  1. <?php echo $this->element('pager')?>  

このままだと非常に汚いページャになってしまうので、CSSを少々いじってみよう。
最後の行に以下を追記すればOK。

app/webroot/css/cake.generic.css
view plainprint?
  1. .pagers {  
  2.   text-align:center;  
  3.   font-size:large;  
  4. }  
  5. .pagers a,  
  6. .pagers span {  
  7.   padding:0 0.2em;  
  8. }  
  9. .pagers .disabled {  
  10.   color:#ccc;  
  11. }  

さて、ブラウザ見てみよう。


■次回のまとめ

今回で
  • ページャ機能を使う
はクリアできた。

次回は
  • 検索結果もページャに反映
部分をやる予定。

つまりSearchプラグインの具体的な使い方ってことだね。
ではお楽しみに。


Follow:

Created by ThemeXpose