In this article, we will show list of products using pagination. Pagination is important feature that provides users to navigate and view articles page by page. Laravel provides pagination feature out-of the box. Laravel's paginate()
and simplePaginate()
method sends data into pagination and show pagination into blade view.
We will start tutorial from the last article, In that article, we have already created dummy data that we will show into pagination. So if you don't have enough data to show into pagination, you can find way to create dummy data.
In the first step after project setup, we need to create a controller which will send view into response. So create a controller using below command into Terminal.
php artisan make:controller ProductController
This will create a ProductController file at app/Http/Controllers
folder. Now open the file and add index()
method which will return view.
<?php
namespace App\Http\Controllers;
use App\Models\Product;
use Illuminate\Http\Request;
class ProductController extends Controller
{
/**
* show product list view.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$products = Product::simplePaginate(10);
return view('products', compact('products'));
}
}
In this step, we will create a route which will handle controller method. Open routes/web.php file and add a new route into it.
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ProductController;
Route::get('products', [ProductController::class, 'index'])->name('products');
In this step, we will create a blade view which will show product list. So create a file resources/views/products.blade.php
and add below code into it.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>All products</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container m-5">
<h1>All products</h1>
<div class="row">
<div class="col-12">
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Description</th>
</tr>
</thead>
<tbody>
@if(count($products) > 0)
@foreach ($products as $product)
<tr>
<th scope="row">{{ $product->id }}</th>
<td>{{ $product->name }}</td>
<td>{{ $product->description }}</td>
</tr>
@endforeach
@else
<tr>
<th colspan="3" class="text-center">No data found</th>
= </tr>
@endif
</tbody>
</table>
{!! $products->links() !!}
</div>
</div>
</div>
</body>
</html>
If you want to customize pagination view, first you need to vendor:publish with following command.
php artisan vendor:publish
And then enter the number of Tag: laravel-pagination, For example 16 in my case:
This will import blade views of pagination at resources/views/vendor/pagination
folder. Laravel has basic two pagination methods. paginate() method will show few page number also where as simplePaginate() method will only show Previous and Next button.
I hope the article will help you.
Hi, My name is Harsukh Makwana. i have been work with many programming language like php, python, javascript, node, react, anguler, etc.. since last 5 year. if you have any issue or want me hire then contact me on [email protected]
Laravel Amazon S3 File Upload Tutorial
AWS provides fast asset loading for web...How to Convert a Date from yyyy-mm-dd to dd-mm-yyyy Format in PHP
Use the strtotime() Function You can...Install Android Studio in Windows 10
Android Studio is Google's official...How to Secure File in Laravel Only Allow to Access Authenticated User
In this article, i will share with you h...React Bootstrap Navbar Example
Bootstrap is easy to create responsive w...