Dalam pengembangan aplikasi web dengan Laravel, pagination merupakan salah satu fitur yang sering digunakan, terutama ketika kita bekerja dengan banyak data. Namun, kadang kita menghadapi masalah ketika menggunakan filter pada data yang dipaginasi, yaitu filter hilang saat berpindah halaman.
Misalnya, ketika pengguna memilih filter tertentu untuk menampilkan data, filter tersebut akan hilang saat mereka berpindah ke halaman lain pada paginasi. Akibatnya, data yang ditampilkan di halaman berikutnya tidak lagi sesuai dengan filter yang sudah dipilih. Nah, jangan khawatir! Di artikel ini, kita akan membahas cara mengatasi masalah tersebut dengan cara yang sangat sederhana.
Penyebab Masalah Pagination dan Filter yang Hilang
Secara default, ketika kita melakukan pagination di Laravel menggunakan fungsi paginate(), Laravel hanya menangani data yang ada pada halaman tersebut tanpa mempertahankan query string (filter) yang mungkin telah kita tetapkan di URL. Akibatnya, saat kita berpindah halaman, filter yang sebelumnya diterapkan akan hilang karena tidak tersimpan pada query string di URL.
Misalnya, kamu mungkin memiliki filter yang menyaring data berdasarkan kategori, harga, atau tanggal, tetapi setelah berpindah ke halaman 2 atau halaman lainnya, filter tersebut tidak lagi diterapkan.
Solusi: Menggunakan appends() di Pagination
Untuk mengatasi masalah ini, kita bisa menggunakan metode appends() milik Laravel. Fungsi ini berguna untuk menambahkan query string ke dalam URL yang dibuat oleh pagination link. Dengan cara ini, setiap halaman baru yang kita klik akan membawa query string (filter) yang diterapkan sebelumnya.
Berikut adalah solusinya:
{{ $your_paginated_collection->appends(request()->query())->links() }}
Langkah-Langkah Mengatasi Pagination dan Filter Hilang:
- Pastikan Pagination Sudah Berjalan Pertama-tama, pastikan kamu sudah menggunakan fungsi paginate() di controller untuk menampilkan data dengan pagination. Misalnya, jika kamu menampilkan data produk, berikut adalah contoh sederhana penggunaan paginate():
$products = Product::where('status', 'active')->paginate(10);
return view('products.index', compact('products'));
return view('products.index', compact('products'));
- Tambahkan Filter ke Query Setelah itu, kamu mungkin ingin menambahkan beberapa filter untuk menyaring data yang ditampilkan. Misalnya, kamu ingin pengguna dapat menyaring produk berdasarkan kategori atau harga.
$query = Product::query();
if ($request->has('category')) {
$query->where('category_id', $request->input('category'));
}
if ($request->has('min_price') && $request->has('max_price')) {
$query->whereBetween('price', [$request->input('min_price'), $request->input('max_price')]);
}
$products = $query->paginate(10);Di sini, kita menggunakan filter pada kategori dan rentang harga.
3. Menggunakan appends() di View Sekarang, di bagian view (misalnya, index.blade.php), kita akan menambahkan metode appends() pada pagination links. Ini bertujuan agar query string dari filter tetap terbawa ketika berpindah halaman.
{{ $products->appends(request()->query())->links() }}
Dengan cara ini, ketika pengguna memilih filter dan kemudian berpindah halaman, query string dari filter tersebut akan tetap ada di URL dan filter akan tetap diterapkan.
Ilustrasi Hasil Akhir
Jika kamu memilih kategori "Elektronik" pada halaman pertama, URL kamu mungkin terlihat seperti ini:
/products?category=elektronik
Setelah berpindah ke halaman 2, URL akan berubah menjadi:
/products?page=2&category=elektronik
/products?page=2&category=elektronik
Ini memastikan bahwa filter yang sudah diterapkan tetap berlaku meskipun kamu berpindah ke halaman lain.
Kesimpulan
Mengatasi masalah hilangnya filter saat menggunakan pagination di Laravel sebenarnya sangat sederhana. Dengan menambahkan metode appends() pada pagination links, kamu bisa mempertahankan query string (filter) saat berpindah halaman. Ini sangat membantu dalam situasi di mana pengguna membutuhkan kontrol lebih pada data yang mereka lihat.
Jadi, sekarang kamu nggak perlu khawatir lagi filter akan hilang ketika paginasi berjalan. Implementasikan solusi ini di project Laravel kamu, dan lihat bagaimana hal ini membuat navigasi data jadi lebih mulus dan pengguna lebih puas!
