Pagination Laravel : Afficher une numérotation continue des éléments par page

🌎 La version anglaise de cette publication : Pagination Laravel : Display continuous numbering of elements per page

La pagination dans Laravel est un mécanisme qui permet de diviser les données en plusieurs pages pour  faciliter la présentation et la navigation lorsqu'il y a un grand nombre de résultats.

Considérons une collection de publications ou $posts que nous récupérons et paginons dans la méthode index du contrôleur pour en afficher 100 par page :

public function index()
{
    $posts = Post::paginate(100);
    return view("posts.index", compact('posts'));
}

Sur la vue resources/views/posts/index.blade.php on peut afficher 100 posts par page et présenter les liens des différentes pages de la pagination comme ceci :

@extends('layouts.app')
@section('content')
<table>
        <thead>
            <tr>
                <th>No.</th>
                <th>Title</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($posts as $post)
            <tr>
                <td>{{ $loop->iteration }}</td>
                <td>{{ $post->title }}</td>
            </tr>
            @endforeach
        </tbody>
    </table>
    
    {{ $posts->links() }}
    
@endsection

Dans ce code source, $loop->iteration permet d'afficher le numéro d'itération à l'intérieur de la boucle et $posts->links() d'afficher les liens de pagination.

Mais remarquez, pour chaque page individuelle l'itération commence à 1. Cela signifie que si nous sommes sur la page 2, la première itération de cette page sera considérée comme la première itération dans l'ensemble de la pagination.

Si nous voulons afficher une numérotation continue sur toutes les pages d'une pagination, nous pouvons combiner le nombre d'éléments par page, le numéro de la page actuelle et l'itération en cours :

@foreach ($posts as $post)
<tr>  
    <td>{{ ($posts->perPage() * ($posts->currentPage() - 1)) + $loop->iteration }}</td>  
    <td>{{ $post->title }}</td>
</tr>
@endforeach

Nous avons dans ce code source :