Guide de la pagination dans Django

La pagination améliore l’expérience de l’utilisateur et les performances de l’application lorsqu’elle traite de grands ensembles de données. Sans un système de pagination en place, votre application sera la plupart du temps à la traîne. Avec Django, vous pouvez exploiter le support intégré de la pagination pour paginer votre application web.

Comment fonctionne la pagination dans Django

L’implémentation de la pagination dans Django peut différer selon que vous travaillez avec des vues basées sur des classes ou des fonctions. Quelle que soit votre méthode préférée, les principes sous-jacents restent les mêmes.

Django utilise une classe appelée Paginateur pour mettre en œuvre la pagination. Le Paginateur fournit plusieurs méthodes que vous pouvez utiliser pour personnaliser votre pagination. Lors de l’initialisation de la classe Paginateur elle prend deux paramètres obligatoires : les données à paginer et le nombre d’éléments à afficher par page. La classe Paginateur ajoute un troisième paramètre optionnel pour les orphelins afin de spécifier le nombre minimum d’éléments qui doivent rester sur la dernière page. Par défaut, la valeur de orphans est de 0, ce qui signifie que toutes les pages ont le même nombre d’éléments.

L’URL d’une page paginée de Django est similaire à celle-ci : https://example.com/products/?page=3. Les page dans l’URL indique à Django la page que l’utilisateur souhaite voir. Il aide également Django à déterminer la partie des données à afficher pour cette page.

Configurer votre projet Django pour la pagination

Avant de paginer dans Django, vous devez avoir installé Django et l’avoir configuré sur votre ordinateur. Après avoir configuré Django sur votre ordinateur, vous devez créer une application et un modèle pour vos données. Voici un modèle simple que vous pouvez copier :

 from django.db import models

class Post(models.Model):

    title = models.CharField(max_length=255)
    author = models.CharField(max_length=50)
    content = models.TextField('Post content')

    def __str__(self):
        return self.title
 

Le modèle ci-dessus est destiné à une application de blog. Il définit les champs titre, auteur et contenu pour chaque article de blog. Il comporte également une méthode qui renvoie le titre de l’article afin d’améliorer l’expérience utilisateur dans le panneau d’administration.

Migrez votre modèle en exécutant cette commande :

 python manage.py makemigrations && python manage.py migrate
 

Après avoir migré votre modèle, vous devez naviguer vers blog>admin.py pour l’enregistrer. Le code suivant enregistre avec succès un modèle appelé Poste.

 from django.contrib import admin
from .models import Post # replace 'Post' with your model name

admin.site.register(Post)
 

Ensuite, créez un superutilisateur et ajoutez des messages dans votre panneau d’administration Django. Pour créer un superutilisateur, utilisez cette commande :

 python manage.py createsuperuser
 

La commande ci-dessus vous conduira à travers le processus illustré dans l’image ci-dessous :

Après avoir créé un superutilisateur, lancez votre serveur de développement et accédez au panneau d’administration.

 python manage.py runserver
 

Une fois votre serveur démarré, naviguez vers http://127.0.0.1:8000/admin, connectez-vous et ajoutez quelques messages.

Ensuite, créez un modèle HTML pour afficher vos articles dans le navigateur. Créez votre fichier dans le répertoire suivant : votre_app/templates/nom_de_votre_app/index.html. Si vous ne savez pas comment créer des modèles, lisez notre guide d’introduction à l’architecture MVT de Django.

La pagination de Django dans une vue basée sur des fonctions

Django vous permet de construire des applications avec des vues basées sur des classes ou des vues basées sur des fonctions. Pour paginer votre application à l’aide d’une vue basée sur des fonctions. Suivez les étapes suivantes :

• Ouvrez votre views.py et importez le fichier Paginateur classe.

 from django.core.paginator import Paginator
 

• Créez une fonction de visualisation pour afficher les articles dans votre modèle HTML.

 from django.shortcuts import render
from .models import Post
from django.core.paginator import Paginator

def list_view(request):
    posts = Post.objects.all()
    return render(request, 'blog/blog_list_view.html', {'posts':posts})
 

• Créez un modèle d’URL pour afficher vos articles dans le navigateur. Commencez par configurer le modèle d’URL dans votre répertoire de projet. Ouvrez le fichier urls.py au niveau du projet et ajoutez ceci au fichier urlpatterns :

 from django.urls import include

urlpatterns = [
    ...,
    path('', include('blog.urls')),
]
 

Dans l’extrait de code ci-dessus, remplacez blog avec le nom de votre application. Si vous ne pouvez pas faire la différence entre un projet et une application, vous devriez savoir comment un projet diffère d’une application dans Django.

Après avoir effectué la configuration ci-dessus, créez un urls.py dans votre répertoire d’application (dans ce cas, il s’agit du fichier blog ) et ajoutez cet extrait de code :

 from django.urls import path
from .views import list_view

urlpatterns = [
    path('', list_view, name='list-view'),
]
 

Lorsque vous lancez votre serveur et que vous naviguez vers http://127.0.0.1:8000/le navigateur affichera vos messages conformément à la feuille de style que vous avez spécifiée.

• Modifiez votre fonction de vue pour ajouter une logique de pagination. Voici un exemple :

 def list_view(request):
    posts = Post.objects.all()
    paginated = Paginator(posts, 3)
    page_number = request.GET.get('page') #Get the requested page number from the URL
    
    page = paginated.get_page(page_number)
    return render(request, 'blog/blog_list_view.html', {'page':page})
 

L’extrait de code ci-dessus introduit trois nouvelles variables : paginé, numéro_de_pageet page. Chaque variable effectue les opérations suivantes :

1. Le paginé variable initialisée la Paginateur . Dans ce scénario, les données à paginer sont l’ensemble de requêtes, posts, et il faut 3 comme le nombre d’éléments à afficher par page.
2. Le numéro_de_page récupère le numéro de page à partir de l’URL. Par exemple, dans http://127.0.0.1:8000/?page=2, le numéro de page est 2.
3. Le page récupère la page spécifique à rendre à partir de la base de données paginée variable.

À ce stade, Django doit avoir paginé votre page. Vous pouvez naviguer vers des pages paginées spécifiques en utilisant le format d’URL illustré dans cette image :

• Modifiez votre modèle HTML pour afficher la navigation dans les pages paginées. En utilisant les méthodes disponibles dans la classe Paginateur vous permet de créer une navigation simple sur votre page. Voici un exemple que vous pouvez ajouter sous votre code HTML initial :

     {% if page.has_previous %}
        <a href="?page={{page.previous_page_number}}" 
 class="btn btn-secondary mx-2">Previous</a>
    {% endif %}

    <a href="?page=1" class="btn btn-secondary">First</a>

    {% for num in page.paginator.page_range %}
        {% if num == page.number %}
            <span>{{ num }}</span>
        {% else %}
            <a href="?page={{num}}" class="btn btn-secondary mx-2">
 {{ num }}
 </a>
        {% endif %}
    {% endfor %}

    <a href="?page={{page.paginator.num_pages}}" class="btn btn-secondary mx-2">
 Last
 </a>

    {% if page.has_next %}
        <a href="?page={{page.next_page_number}}" class="btn btn-secondary mx-2">
 Next
 </a>
    {% endif %}
 

Dans l’extrait de code ci-dessus, les méthodes suivantes sont utilisées en conjonction avec des instructions conditionnelles pour déterminer à quoi ressemblera la navigation par pagination :

1. has_previous: Cette méthode renvoie Vrai s’il existe une page précédente dans les données paginées.
2. numéro_de_page_précédente: Cette méthode renvoie la valeur de la page précédente.
3. page_range: Cette méthode vous permet de savoir combien de pages vous avez dans vos données paginées.
4. nombre: Cette méthode renvoie la valeur de la page en cours.
5. num_pages: Cette méthode renvoie le nombre total de pages.
6. has_next: Cette fonction renvoie Vrai s’il existe une page suivante dans les données paginées.
7. numéro_de_page_suivante: Cette méthode renvoie la valeur de la page suivante.

Pagination Django dans une vue basée sur des classes

Dans une vue basée sur des classes, il n’est pas nécessaire d’importer et d’initialiser la classe Paginateur classe. Pour mettre en œuvre la pagination dans une vue basée sur une classe, vous devez spécifier un attribut appelé paginate_by. Suivez ces étapes pour paginer votre application avec une vue basée sur les classes :

• Écrivez une vue basée sur une classe et spécifiez l’option paginate_by . Voici un exemple simple :

 from .models import Post
from django.views.generic import ListView

class PostListView(ListView):
    model = Post
    template_name = 'blog/blog_list_view.html'
    context_object_name = 'page'
    paginate_by = 2
 

La vue ci-dessus est la version basée sur les classes de la vue basée sur les fonctions écrite précédemment. Cette vue hérite de la classe ListView classe utilisée pour lister les éléments. Elle définit sa logique à l’aide d’attributs tels que modèle, nom_du_modèle, nom_de_l’objet_contexteet paginate_by. Les paginer_par détermine le nombre d’articles à afficher par page ; dans ce cas, 2 articles.

• Une fois que vous avez créé votre vue, modifiez votre urls.py pour l’utiliser. Voici un exemple simple :

 from .views import PostListView

urlpatterns = [
    path('', PostListView.as_view(), name='list-view'),
]
 

• Modifiez votre modèle HTML pour utiliser page_obj pour la pagination.

     {% if page_obj.has_previous %}
        <a href="?page={{page_obj.previous_page_number}}" 
 class="btn btn-secondary mx-2">Previous</a>
    {% endif %}

    <a href="?page=1" class="btn btn-secondary">First</a>

    {% for num in page_obj.paginator.page_range %}
        {% if num == page_obj.number %}
            <span class="current-page">{{ num }}</span>
        {% else %}
            <a href="?page={{num}}" class="btn btn-secondary mx-2">
 {{ num }}
 </a>
        {% endif %}
    {% endfor %}

    <a href="?page={{page_obj.paginator.num_pages}}" 
 class="btn btn-secondary mx-2">
 Last
 </a>

    {% if page.has_next %}
        <a href="?page={{page_obj.next_page_number}}" 
 class="btn btn-secondary mx-2">
 Next
 </a>
    {% endif %}
 

Contrairement au modèle HTML pour la vue basée sur les fonctions, ce modèle utilise le format page_obj au lieu de page pour représenter l’objet page. C’est le comportement par défaut de la pagination basée sur les classes dans Django.

Utiliser la pagination pour rendre votre application évolutive

La pagination réduit la charge sur votre serveur/base de données en récupérant et en affichant de plus petits sous-ensembles de données à la fois. Grâce à la pagination, les performances de vos sites web augmenteront. Vos utilisateurs auront également une bonne expérience lors de l’utilisation de votre application.

Les vues basées sur les classes permettent de gagner du temps et d’économiser du code par rapport aux vues basées sur les fonctions, mais vous pouvez utiliser l’une ou l’autre en fonction de vos préférences et des spécifications du projet.