Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Cake php4designers

6,615 views

Published on

当日トラブルで

  • Be the first to comment

Cake php4designers

  1. 1. ページネータ の お 話 です ヨ !
  2. 2. 今、喋ってるヤツ! 一人称 は 俺 って 言 います 俺の名は オガーン 今後ともよろしく プログラムとか デザインとか Web系 全般
  3. 3. ページネータとは? << < 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 > >> << < 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 > >> ID Name Email Created Modified 1 Jinmu [email_address] 2011.07.01 2011.07.01 2 Suizei [email_address] 2011.07.01 2011.07.01 3 Annei [email_address] 2011.07.02 2011.07.02 4 Itoku [email_address] 2011.07.02 2011.07.02
  4. 4. ページネータの構成要素 first last prev next numbers 最初のページ 最後のページ 前のページ 次のページ 付近のページ番号
  5. 5. 基本的な構造 <?php echo $paginator->first(' 最初 ') ?> <span> <a href=”/users/index/page:1”> 最初 </a> </span>
  6. 6. first、prev、next、last <?php echo $paginator->first(' 最初 ') ?> <?php echo $paginator->prev(' 前 ') ?> <?php echo $paginator->next(' 次 ') ?> <?php echo $paginator->last(' 最後 ') ?> <span><a href=”/users/index/page:1”> 最初 </a></span> <span class=”prev”><a href=”/users/index/page:3”> 前 </a></span> <span class=”next”><a href=”/users/index/page:5”> 次 </a></span> <span><a href=”/users/index/page:128”> 最後 </a></span>
  7. 7. 注意点 next() 、 prev() は 問題ない first() 、 last() は クラス名つかない リンク先がない場合 何も表示しない
  8. 8. first、prev、next、last <?php echo $paginator->first(' 最初 ') ?> <?php echo $paginator->prev(' 前 ') ?> <?php echo $paginator->next(' 次 ') ?> <?php echo $paginator->last(' 最後 ') ?> <span class=”prev”><a href=”/users/index/page:3”> 前 </a></span> <span class=”next”><a href=”/users/index/page:5”> 次 </a></span> <span><a href=”/users/index/page:128”> 最後 </a></span> 空&っぽ
  9. 9. ちょっとしたロジック <?php if($paginator->hasPrev()) {?> <?php echo $paginator->first(' 最初 ', array( 'class'='first') ) ?> <?php } else { ?> <span class=”first”> 最初 </span> <?php } ?> もし 1 つ前のページが存在したら ページネータつかって「最初」って表示するアルよ そうじゃなかったら 普通に HTML で「最初」って表示するアルよ 面倒 くさいで おます
  10. 10. numbers <?php echo $paginator->numbers( オプション ) ?> オプション名 modulus 説明 表示するページ数を数値で指定 first 必ず表示する先頭ページのページ数を数値で指定 last 必ず表示する最後ページのページ数を数値で指定
  11. 11. numbers 1 | 2 ... 3 | 4 | 5 | 6 | 7 | 8 | 9 ...127 | 128 modulus last first 'first' => 2 'last' => 2 'modulus' => 7
  12. 12. counter <?php echo $paginator->counter(array( 'format' => フォーマット )) ?> フォーマット変数 %pages% 説明 総ページ数 %page% 現在のページ番号 %count% 総レコード数 %start% 現在のページの最初のレコード番号 %end% 現在のページ最後のレコード番号
  13. 13. counter 全 %pages% ページのうち %page% ページ目を表示しています。 全 %count% 件のうち %start% 〜 %end% 件を表示しています。
  14. 14. counter 全 30 ページのうち 9 ページ目を表示しています。 全 600 件のうち 161 〜 180 件を表示しています。 %pages% %page% %count% %start% %end%
  15. 15. トドメを刺すよ <ul><li>各paginatorは単独でHTMLを出力するんだな
  16. 16. つまりまとまりがないんだな
  17. 17. なので、ブロック要素で囲うぜよ!! </li></ul>オイラは トドメを刺す刺す 処理係!! 大
  18. 18. 刺す刺す! <div class=”pager”> <?php if($paginator->hasPrev()) {?> <?php echo $paginator->first(' 最初 ',array( 'class'=>'first'))?> <?php } else { ?> <span class=”first”> 最初 </span> <?php } ?> <?php echo $paginator->prev(' 前 ')?> <?php echo $paginator->numbers()?> <?php echo $paginator->next(' 次 ')?> <?php if($paginator->hasNext()) {?> <?php echo $paginator->first(' 最後 ',array( 'class'=>'last'))?> <?php } else { ?> <span class=”last”> 最後 </span> <?php } ?> </div> 大
  19. 19. CSS自由自在 /** * Paginator のスタイル */ /* 最初 */ .pager .first { 「最初」のテキスト } .pager .first a { 「最初」のリンク } /* 最後 */ .pager .last { 「最後」のテキスト } .pager .last a { 「最後」のリンク } /* 前 */ .pager .prev { 「前」のテキスト } .pager .prev a { 「前」のリンク } /* 次 */ .pager .next { 「次」のテキスト } .pager .next a { 「次」のリンク }
  20. 20. サンプル
  21. 21. どっとはらい ありがとう ございました

×