ユーザ用ツール

サイト用ツール


プログラム言語:php:laravel:ページャ

Laravel のページネーション

参考:https://readouble.com/laravel/7.x/ja/pagination.html

ユーザ情報を10件ずつ表示するページャを実装したい場合、以下のような記述をすれば可能。

  1. $result = DB::table('users')->paginate(10);

ページャの表示

blade の html ファイル内に以下を記述。

  1. {{ $users->links() }}

ビューのカスタマイズ

ページャ呼び出し時に、ビューのファイル名を指定する。

  1. {{ $users->links('view.name') }}

ページャに表示するリンクの調整

Laravel 7 のマニュアルによれば以下の記載で、両サイドに表示するリンクの数を調整できるらしいが、私の環境では動作せず。

  1. {{ $users->onEachSide(2)->links() }}

仕方ないので、ビューファイル内で自分で調整を。
html ファイルの呼び出し時に、side パラメータで両サイドに表示するリンク数を渡す。

  1. {{ $arts->links('layouts/pager', ['side' => 2]) }}

layouts/pager.blade.php ファイル内の記述

  1. @if ($paginator->hasPages())
  2. <ul>
  3. @if (!$paginator->onFirstPage())
  4. <li class="prev"><a href="{{ $paginator->previousPageUrl() }}"></a></li>
  5. @endif
  6. @if ($paginator->currentPage() - $side > 2)
  7. <li class="more"><a>…</a></li>
  8. @endif
  9.  
  10. @foreach ($elements as $element)
  11. @if (is_array($element))
  12. @foreach ($element as $page => $url)
  13. @if ($page == $paginator->currentPage())
  14. <li class="active"><a>{{ $page }}</a></li>
  15. @else
  16. <?php
  17. if ($page + $side < $paginator->currentPage()
  18. && !($page === 1 && $paginator->currentPage() - $side === 2)
  19. ) {
  20. continue;
  21. } elseif ($page - $side > $paginator->currentPage()
  22. && !(
  23. $page === $paginator->lastPage()
  24. && $paginator->currentPage() + $side === $paginator->lastPage() - 1
  25. )
  26. ) {
  27. continue;
  28. }
  29. ?>
  30. <li><a href="{{ $url }}">{{ $page }}</a></li>
  31. @endif
  32. @endforeach
  33. @endif
  34. @endforeach
  35.  
  36. @if ($paginator->currentPage() + $side < $paginator->lastPage() - 1)
  37. <li class="more"><a>…</a></li>
  38. @endif
  39. @if ($paginator->hasMorePages())
  40. <li class="next"><a href="{{ $paginator->nextPageUrl() }}"></a></li>
  41. @endif
  42. </ul>
  43. @endif

これで現在のページの左右に side で指定した数だけリンクが表示されることを確認できました。

コメント

コメントを入力. Wiki文法が有効です:
 
プログラム言語/php/laravel/ページャ.txt · 最終更新: 2021/01/22 17:06 by humolife