Django によるコメント掲示板の開発：目次

Django によるコメント掲示板の開発

コメント一覧のページネーション

generic モジュールを使ったページネーションがまだ実現できていない場合は，まずはこのページを参考に次のような simple_pagination.html を準備してください．

comments/templates/simple_pagination.html
<nav aria-label="Page navigation example">
    <ul class="pagination justify-content-center pagination-lg g-mt-28 g-mb-28">
        {% if page_obj.has_previous %}
            <li class="page-item">
                <a class="page-link" href="?page={{ page_obj.previous_page_number }}">
                    <span aria-hidden="true">«</span>
                </a>
            </li>
        {% else %}
            <li class="page-item">
                <a class="page-link disabled">
                    <span aria-hidden="true">«</span>
                </a>
            </li>
        {% endif %}
        {% if page_obj.has_next %}
            <li class="page-item">
                <a class="page-link" href="?page={{ page_obj.next_page_number }}">
                    <span aria-hidden="true">»</span>
                </a>
            </li>
        {% else %}
            <li class="page-item">
                <a class="page-link disabled">
                    <span aria-hidden="true">»</span>
                </a>
            </li>
        {% endif %}
    </ul>
</nav>

ページネーションを実現するために，views.py に paginate_queryset( ) 関数を追加し，comments_index( ) からそれを呼び出します．

comments/views.py
from django.urls import reverse_lazy
from django.shortcuts import render
# from django.http import HttpResponse
# from django.views.generic import ListView
from django.views.generic import DetailView
from django.views.generic import CreateView
from django.views.generic import UpdateView
from django.views.generic import DeleteView
from django.shortcuts import redirect
from django.contrib import messages
from .forms import CommentForm
from .models import Comment
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger

# Create your views here.

def paginate_queryset(request, queryset, count):
    paginator = Paginator(queryset, count)
    page = request.GET.get('page')
    try:
        page_obj = paginator.page(page)
    except PageNotAnInteger:
        page_obj = paginator.page(1)
    except EmptyPage:
        page_obj = paginator.page(paginator.num_pages)
    return page_obj

def comments_index(request):
    paginate = request.GET.get(key="paginate", default="2")
    comments_list = Comment.objects.all()
    page_obj = paginate_queryset(request, comments_list, paginate)
    context = {
        'comments' : page_obj.object_list,
        'page_obj': page_obj,
        'paginate': paginate,
    }
    return render(request, 'comments/index.html', context)

また，index.html ファイルにはページネーションのリンクが設置済みであることを確認してください．

comments/templates/comments/index.html
{% extends "base.html" %}

{% block title %}
コメント一覧
{% endblock %}

{% block content %}
    <div class="container">
        <h1 class="my-5">コメント一覧</h1>
        {% for comment in comments %}
            <div class="card mb-3">
                <div class="card-body">
                    <h5 class="card-title">
                        <a href="{% url 'comments:show' comment.id  %}">
                            {{ comment.title }}
                        </a>
                    </h5>
                    <p class="card-text">{{ comment.body }}</p>
                </div>
            </div>
        {% endfor %}
        {% include 'simple_pagination.html' %}
        <hr>
        <div>
            <p>
                <a href="{% url 'comments:create' %}">
                    新規コメントの投稿
                </a>
            </p>
        </div>
    </div>
{% endblock content %}

Webサーバを起動してブラウザで動作を確認します．

(py39) C:\Users\lecture\Documents\django\django_comment>python manage.py runserver ⏎
Watching for file changes with StatReloader
Performing system checks...

ページの切り替えがうまくできるはずです．今は id 順番に表示されていますが，次のページでは最終更新順に並び替えて表示する方法を説明します．

目次に戻る

« 戻る次へ »