如何在Django项目中组织具有大量页面的分页? [英] How organize pagination with a large number of pages in Django project?
本文介绍了如何在Django项目中组织具有大量页面的分页?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个 view.py product_list:
I have a view.py product_list:
...
from django.shortcuts import render, get_object_or_404
from .models import ProductCategory, Product, ProductDetail, ProductSpecialCategory
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
...
def product_list(request, category_slug=None, ):
category = None
categories = ProductCategory.objects.all()
object_list = Product.objects.filter(available=True, is_active=True)
if category_slug:
category = get_object_or_404(ProductCategory, slug=category_slug)
object_list = object_list.filter(category=category)
paginator = Paginator(object_list, 1)
page = request.GET.get('page')
try:
products = paginator.page(page)
except PageNotAnInteger:
products = paginator.page(1)
except EmptyPage:
products = paginator.page(paginator.num_pages)
return render(request, 'shop/products/list_by_category/product_list.html', {'category': category,
'categories': categories,
'products': products,
})
基于此处理程序,我做了 pagination.html :
Based on this handler, I did pagination.html:
<nav aria-label="pagination" class="pagination_area">
<ul class="pagination">
{% if page.has_previous %}
<li class="page-item next">
<a class="page-link" href="?page={{ page.previous_page_number }}">
<i class="fa fa-angle-left" aria-hidden="true"></i>
</a>
</li>
{% endif %}
{% for i in page.paginator.page_range %}
{% if page.number == i %}
<li class="page-item focused"><a class="page-link" href="?page={{ i }}">{{ i }}</a></li>
{% elif i > page.number|add:'-1' and i < page.number|add:'1' %}
{% else %}
<li class="page-item"><a class="page-link" href="?page={{ i }}">{{ i }}</a></li>
{% endif %}
{% endfor %}
{% if page.has_next %}
<li class="page-item next">
<a class="page-link" href="?page={{ page.next_page_number }}">
<i class="fa fa-angle-right" aria-hidden="true"></i>
</a>
</li>
{% endif %}
</ul>
在界面上,我得到**结果**:
On the interface, I get the **result**:
我要这样组织:
仅显示三页,第一个是前一个,第二个是当前,第三个是下一个。 :
推荐答案
我更改了 pagination.html 。请尝试这样做。
I change pagination.html. Please try this.
<nav aria-label="pagination" class="pagination_area">
<div class="row">
{% if page.end_index > 0 %}
<div class="col-sm-12 col-md-5 d-none d-md-block">
<p>Showing {{ page.start_index }} to {{ page.end_index }} of {{ page.paginator.count}}.</p>
</div>
{% endif %}
{% if page.paginator.num_pages > 1 %}
<div class="col-sm-12 col-md-7 dataTables_pager">
<ul class="pagination">
{% if page.has_previous %}
<li class="page-item">
<a class="page-link" data-page="1" href="?page={{ page.previous_page_number }}">
<i class="fa fa-angle-double-left"></i>
</a>
</li>
{% if page.previous_page_number > 1 %}
<li class="page-item">
<a class="page-link " data-page="{{page.previous_page_number}}" href="?page={{ page.previous_page_number }}">
<i class="fa fa-angle-left"></i>
</a>
</li>
{% endif %}
{% endif %}
{% if page.previous_page_number > 2 %}
<li class="page-item">
<a class="page-link " data-page="{{page.number|add:'-2'}}" href="?{{page.number|add:'-2'}}"> {{ page.number|add:"-2" }} </a>
</li>
<li class="page-item">
<a class="page-link " data-page="{{page.number|add:'-1'}}" href="?page={{page.number|add:'-1'}}"> {{ page.number|add:"-1" }} </a>
</li>
{% endif %}
<li class="page-item active"><span class="page-link ">{{ page.number }}</span></li>
{% if page.paginator.num_pages > page.number|add:"2" %}
<li class="page-item">
<a class="page-link " data-page="{{page.number|add:'1'}}" href="?page={{page.number|add:'1'}}"> {{ page.number|add:"1" }} </a>
</li>
<li class="page-item">
<a class="page-link " data-page="{{page.number|add:'2'}}" href="?page={{page.number|add:'2'}}"> {{ page.number|add:"2" }} </a>
</li>
{% endif %}
{% if page.has_next %}
<li class="page-item">
<a class="page-link " data-page="{{page.next_page_number}}" href="?page={{ page.next_page_number }}">
<i class="fa fa-angle-right"></i>
</a>
</li>
<li class="page-item">
<a class="page-link " data-page="{{page.paginator.num_pages}}" href="?page={{page.paginator.num_pages}}">
<i class="fa fa-angle-double-right"></i>
</a>
</li>
{% endif %}
</ul>
</div>
{% endif %}
</div>
</nav>
我的设计就是这样。如果您根据需要更改设计。
在这里单击<
进入首页,>>
进入最后一页, <
转到上一页,>
转到下一页。
My design just like this. If you change design for your needs.
Here click <<
to go first page , >>
to go last page , <
to go previous page and >
to go next page.
这篇关于如何在Django项目中组织具有大量页面的分页?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文