Membuat Pagination Eloquent Laravel

Pagination atau bisa disebut paging pada suatu halaman digunakan untuk membagi beberapa bagian halaman. Pada kesempatan kali ini Anda akan memanfaatkan pagination dari Laravel agar semua data yang dikeluarkan tidak memakan waktu pemuatan halaman yang lama. Secara bawaan jumlah data perhalaman pada Laravel sebanyak 15 data, Anda bisa menyetelnya pada model atau langsung pada fungsi paginate() yang akan dibahas dibawah ini.

Daftar isi:

1. Templat pagination bulma

Perlu diketahui kalau Laravel sudah menyediakan templat secara bawaan baik dari templat Bootstrap, Tallwindcss, dan SematicUI. Anda bisa melihat semua templat tersebut dengan perintah dibawah ini:

php artisan vendor:publish --tag=laravel-pagination

Lihat gambar dibawah ini:

gambar 1

Akan tetapi karena tutorial ini menggunakan kerangka kerja CSS Bulma maka Anda harus menyiapkannnya sendiri, tetapi ini sangat mengaksikan karena Anda mendapatkan ilmu yang lebih dari ini. Buatlah berkas pagination.blade.php pada direktori layouts kemudian salin dan tempelkan skrip dibawah ini:

@if ($paginator->hasPages())
    <nav class="pagination is-rounded" role="navigation" aria-label="pagination">

        @if ($paginator->onFirstPage())
            <a class="pagination-previous" disabled>
                {!! __('pagination.previous') !!}
            </a>
        @else
            <a href="{{ $paginator->previousPageUrl() }}" class="pagination-previous">
                {!! __('pagination.previous') !!}
            </a>
        @endif

        @if ($paginator->hasMorePages())
            <a href="{{ $paginator->nextPageUrl() }}" class="pagination-next">
                {!! __('pagination.next') !!}
            </a>
        @else
            <a class="pagination-next" disabled>
                {!! __('pagination.next') !!}
            </a>
        @endif

        <ul class="pagination-list">
            @foreach ($elements as $element)
            
                @if (is_string($element))
                    <li><span class="pagination-ellipsis">&hellip;</span></li>
                @endif

                @if (is_array($element))
                    @foreach ($element as $page => $url)
                        @if ($page == $paginator->currentPage())
                            <li>
                                <a class="pagination-link is-current" aria-label="Page {{ $page }}" aria-current="page">
                                    {{ $page }}
                                </a>
                            </li>
                        @else
                            <li>
                                <a href="{{ $url }}" class="pagination-link" aria-label="Goto page {{ $page }}">
                                    {{ $page }}
                                </a>
                            </li>
                        @endif
                    @endforeach
                @endif

            @endforeach
        </ul>

    </nav>
@endif

2. Konfigurasi pagination default

Saatnya Anda mengatur konfigurasi agar templat paging menjadi standar bawaan untuk paging Anda. Bukalah berkas AppServiceProvider.php pada direktori app\Providers kemudian sesuaikan skrip dibawah ini:

use Illuminate\Pagination\Paginator;
...

public function boot()
{
    Paginator::defaultView('layouts.pagination');
}

Lihat gambar ini untuk lebih jelasnya:

gambar 2

3. Perbarui fungsi index()

Pada berkas UserController silakan sesuaikan fungsi index() pada skrip dibawah ini:

$users = User::paginate(5);

return view('users.index', compact('users'));

Hal ini akan mengeluarkan data sebanyak 5 Anda bisa mengaturnya secara kustom baik 3, 5, dan bahkan 20 data yang akan dikeluarkan.

4. Perbarui berkas index.blade.php

Disinilah waktunya Anda untuk menampilkan paging di halaman indeks pengguna dan perlu diketahui paging tidak akan tampil kalau banyak paging 5 dan jumlah data 5. Kecuali jika data lebih dari 5. Silakan letakan skrip dibawah ini pada index.blade.php dibagian bawah sebelum @endsection.

{{ $users->links() }}

Lihat gambar dibawah ini untuk lebih jelasnya:

gambar 3

Bonus - menyetel pagination di model

Menyetel pagination di model mengakibatkan semua pengeluaran data berpengaruh pada saat Anda menggunakan fungsi paginate() tanpa menambah argumen apapun. Anda bisa menemukan ini pada repositori Github Laravel Eloquent Model. Selanjutnya salin dan tempelkan skrip dibawah ini pada model Anda seperti User.php:

/**
 * The number of models to return for pagination.
 *
 * @var int
 */
protected $perPage = 10;

Selamat mencoba!