実現したいこと
Djangoで日記アプリケーションを作成しています。マイページ上でプロフィールだけでなく、自分が投稿した記事の一覧を併せて表示させており、表示させる記事の数を最大6にして、それ以降はページネーションによって記事を分割表示しようとしています。
前提
モデル
・主モデルCustomUserに対して、従モデルArticleが一対多でリレーションシップ関係を取っています
・Articleモデルのリレーションフィールド(post_user)では、下記サイトを参考に、テンプレート側で逆参照を出来るように、related_nameオプションを設定しています
https://qiita.com/ragnar1904/items/1afaeb6601cc490fb70a#%E9%80%86%E5%8F%82%E7%85%A7%E3%81%AE%E5%A0%B4%E5%90%88
#models.py
class CustomUser(AbstractUser):
username = models.CharField(
_("username"),
max_length=30,
help_text='Required 30 characters or fewer.',
unique=True,
error_messages={
'unique': _("This Username already exists."),
},)
email = models.EmailField(
_('email'),
unique=True,
error_messages={
'unique': _("A user with that email address already exists."),
},)
class Meta:
verbose_name_plural = 'CustomUser'
class Article(models.Model):
post_user = models.ForeignKey(CustomUser, verbose_name='Post User', on_delete=models.CASCADE, related_name='name',)
title = models.TextField(verbose_name='title', max_length=50,)
content = MDTextField()
thumbnail = models.ImageField(verbose_name='thumbnail', null=False, blank=False,)
ビュー
・ビューではListViewを継承し、クラス変数model
にはCustomUserを指定し、クラス変数paginate_by
の指定も行う
・get_queryset()のオーバーライドでは、マイページのユーザに紐づくArticleモデルのクエリーセットをテンプレートへ渡すようにする
#views.py
class MyPageView(LoginRequiredMixin, generic.ListView):
template_name = 'mypage.html'
model = CustomUser
paginate_by = 6
def get_queryset(self):
articles = CustomUser.objects.filter(username=self.request.user).prefetch_related('name')
return articles
テンプレート
・テンプレートでは、主テーブルCustomUserのクエリを{% for s in customuser_list %}
で取り出し、従テーブルArticleのクエリを{% for article in s.name.all %}
で取り出す。
<!--mypage.html-->
{% for s in customuser_list %}
<section class="u-content-space">
<div class="container">
<header class="text-center w-md-50 mx-auto mb-8">
<h2 class="h1">Prototyping Works by {{ s.username }}</h2>
</header>
<div class="js-shuffle u-portfolio row no-gutters mb-6">
{% for article in s.name.all %}
<figure class="col-sm-6 col-md-4 u-portfolio__item" data-groups='["its-illustration"]'>
<img class="u-portfolio__image_original" src="{{ article.thumbnail.url }}" alt="Image Description">
<figcaption class="u-portfolio__info">
<h6 class="mb-0">{{ article.title }}</h6>
</figcaption>
</figure>
{% endfor %}
<!--ページネーション処理-->
{% if is_paginated %}
<div class="row justify-content-between align-items-center mb-4">
<div class="col-lg">
<nav aria-label="Bootstrap Pagination Example">
<ul class="pagination mb-0">
<!--前ページへのリンク-->
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.previous_page_number }}">
<span class="mr-1 d-none d-sm-inline-block">←</span> Previous
</a>
</li>
{% endif %}
<!--ページ数表示-->
{% for page_num in page_obj.paginator.page_range %}
{% if page_obj.number == page_num %}
<li class="page-item active">
<a class="page-item" href="#">{{ page_num }}</a>
</li>
{% else %}
<li class="page-item">
<a class="page-link" href="?page={{ page_num }}">{{ page_num }}</a>
</li>
{% endif %}
{% endfor %}
<!--次ページへのリンク-->
{% if page_obj.has_next %}
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.next_page_number }}">
Next<span class="ml-1 d-none d-sm-inline-block">→</span>
</a>
</li>
{% endif %}
</ul>
</nav>
</div>
</div>
{% endif %}
</div>
</section>
{% endfor %}
発生している問題
paginate_byで指定した値を上回る数の記事が表示され、さらにページネーションに関わる表示も一切ありませんでした。
ブラウザの検証ツールを用いてhtmlを確認してみたところ、ページネーションに関するコードが記載されていなかった為、テンプレートの{% if is_paginated %}
がFalseだと判定されたのだと理解しました。
原因はviewsでページネーションに関するメソッドのオーバーライドで一工夫する必要があるかと考えましたが、調べても同じような事例を見つけることができず、どうすれば良いのか頭を抱えています。
試したこと
・ブラウザのキャッシュを削除し再度読み込みを行なってもページネーションの表示がされることはありませんでした。
・下記のページを参考にget_paginate_byをオーバーライドしましたが、ブラウザ上の表示は変わりませんでした。
https://teratail.com/questions/243787
def get_paginate_by(self, queryset):
return self.request.GET.get('paginate_by', MyPageView.paginate_by)
補足情報(FW/ツールのバージョンなど)
開発環境は下記の通りです
・python 3.7.6
・Anacondaローカル内
・Django3系
・MacOS
・Chromeブラウザ