Learn how to get the previous and next records in Laravel using the record name or title to display links on the front-end to allow users to navigate easily
Please support us by disabling your ad-block. The revenue help us create more content for the community.
In this post, you will learn how to get previous and next records in Laravel by using the record's name sorted in ascending or descending order. In our other post Getting previous and next record in Laravel, we have guided you on how to get the "previous" and "next" by using the "record ID" and columns that have a "number" value but in this post, you will learn the other approach.
Step 1: Define the Column To Sort By
Firstly you have to define the column to be used for sorting. For example, do imagine a "Post" eloquent model that has a "Title" column or an "Article" eloquent model that has a "Name" column and sort it in ascending order.
<?php
// If you are using "Post" model then your code should be as follows
$posts = Post::query()->sortBy('title', 'asc')->get();
// Or if you are using Article model then sort it by the "name" column
$articles = Article::query()->sortBy('name', 'asc')->get();
In a real-world scenario, you might also want to select only the one that's published and only select the columns that are necessary.
The next step is to define the logic to get the previous and next posts. The important part is to find the logic to get the location of the "index" from the collection of posts. To achieve this, you need to compare the existing post against the current Post collection. This location of this code should be in the "Show" method of your PostController.
The code logic above will retrieve the previous post and next post by using the post index we retrieved earlier using the "search" method available from the Laravel Collection instance. Since the "posts" is accessible using the array notation you can call it like the following "$posts[$theIndex]".
Step 3: Create Laravel Livewire Component
Now that you have retrieved the previous and next post, you can then display it on the front-end blade template. In this case, you can create a Laravel Livewire component to make it reusable across the application. To create the Laravel Livewire component, do run the command below. If you have not installed it, do make sure to check this getting started guide from the official Laravel Livewire website.
php artisan livewire:make components/prev-next
The command above will output the following in the terminal.
COMPONENT CREATED 🤙
CLASS: app/Http/Livewire/Components/PrevNext.php
VIEW: resources/views/livewire/components/prev-next.blade.php
From the PrevNext component class, you can define the required properties that can be passed on to the component. Do refer to the code below for the full implementation.
<?php
namespace App\Http\Livewire\Components;
use Livewire\Component;
class PrevNext extends Component
{
public $prevLabel;
public $nextLabel;
public $prevTitle;
public $nextTitle;
public $prevUrl;
public $nextUrl;
public function render()
{
return view('livewire.components.prev-next');
}
}
Now from the "prev-next" blade component, you can define navigation links. I have placed multiple checks for the previous and next variables and it will facilitate all the necessary conditions.
PostSrc Previous and Next Code Snippets By now you should be able to Get Prev And Next Records Sorted By Name and create custom Laravel Livewire components to make it reusable across the application. If you find this tutorial helpful do make sure to share it with your friends and cheers, happy coding!
