Django ListView如何获得digg风格的分页

时间:2015-07-31 05:36:52

标签: django listview pagination django-class-based-views

class Shipment(ListView):
    template_name = "listing-base.html"
    model = Shipment
    context_object_name = "shipment_list"
    paginate_by = 25

输出就像这样

Previous Page 1   of  7  NEXT PAGE

相反,我需要

 Previous Page 1 2 ...5..7  NEXT PAGE

请提前帮助,谢谢 “

3 个答案:

答案 0 :(得分:3)

这个用CBV进行了测试,它是blog post代码的修改版本。

分页已添加到模板标记中,因此您只需为ListView呈现的任何模板加载分页,例如listing-base.html

{% load paginator_tags %}

<!-- your list -->

{% get_pagination 2 1 %}

get_paginationpaginator_tags.py中定义的模板标记。更改first_last_amountbefore_after_amount您可以控制要显示的页数:

Previous  1  2  ... 5  6  7  8  9  10  11  ... 25  26  Next

paginator_tags.py

from django import template

register = template.Library()


@register.inclusion_tag('_pagination.html', takes_context=True)
def get_pagination(context, first_last_amount=2, before_after_amount=4):
    page_obj = context['page_obj']
    paginator = context['paginator']
    is_paginated = context['is_paginated']
    page_numbers = []

    # Pages before current page
    if page_obj.number > first_last_amount + before_after_amount:
        for i in range(1, first_last_amount + 1):
            page_numbers.append(i)

        if first_last_amount + before_after_amount + 1 != paginator.num_pages:
            page_numbers.append(None)

        for i in range(page_obj.number - before_after_amount, page_obj.number):
            page_numbers.append(i)

    else:
        for i in range(1, page_obj.number):
            page_numbers.append(i)

    # Current page and pages after current page
    if page_obj.number + first_last_amount + before_after_amount < paginator.num_pages:
        for i in range(page_obj.number, page_obj.number + before_after_amount + 1):
            page_numbers.append(i)

        page_numbers.append(None)

        for i in range(paginator.num_pages - first_last_amount + 1, paginator.num_pages + 1):
            page_numbers.append(i)

    else:
        for i in range(page_obj.number, paginator.num_pages + 1):
            page_numbers.append(i)

    return {
        'paginator': paginator,
        'page_obj': page_obj,
        'page_numbers': page_numbers,
        'is_paginated': is_paginated,
    }

_pagination.html档案:

{% if is_paginated %}
<div class="pagination-wrapper">
    <ul class="pager">
    {% if page_obj.has_previous %}
        <li><a href="?page={{ page_obj.previous_page_number }}">Previous</a></li>
    {% endif %}
    {% for page in page_numbers %}
        {% if page %}
            {% ifequal page page_obj.number %}
                <li class="disabled"><a href="#">{{ page }}</a></li>
            {% else %}
                <li><a href="?page={{ page }}">{{ page }}</a></li>
            {% endifequal %}
        {% else %}
            ...
        {% endif %}
    {% endfor %}
    {% if page_obj.has_next %}
        <li><a href="?page={{ page_obj.next_page_number }}">Next</a></li>
    {% endif %}
    </ul>
</div>
{% endif %}

答案 1 :(得分:1)

您可以使用Django Endless Pagination并轻松实现digg-styled pagination

答案 2 :(得分:0)

尝试下面的approch

在views.py中

page = request.POST['page_numb']
paginator = Paginator(object_list, 10)
lenth_data1 = paginator.num_pages
lenth_data = range(1, lenth_data1 + 1)
return render(request, 'home/home.html', {'lenth_data':lenth_data})

in html

<input type="hidden" value="{{ organization_search.number }}" id="page_numb2"name="page_numb">
<ul class="pagination">
                                {% if organization_search.has_previous %}
                                    <li class="waves-effect overlay">
                                        <a
                                                id="{{ i }}nexssa"
                                                onclick="nex({{ organization_search.previous_page_number }})">
                                            <i class="mdi-navigation-chevron-left"></i></a></li>
                                {% else %}
                                    <li class="disabled"><a href="#!"><i class="mdi-navigation-chevron-left"></i></a>
                                    </li>
                                {% endif %}
                                {% for i in lenth_data %}
                                    <li class="overlay waves-effect {% if forloop.counter == organization_search.number %}active{% endif %}">
                                        <a
                                                id="{{ i }}nex" onclick="nex({{ i }})">{{ i }}</a></li>
                                {% endfor %}
                                {% if organization_search.has_next %}
                                    <li class="waves-effect">
                                        <a
                                                id="{{ i }}nexsa"
                                                onclick="nex({{ organization_search.next_page_number }})"><i
                                                class="mdi-navigation-chevron-right"></i></a></li>

                                    {#                                    <a href="?page={{ organization_search.next_page_number }}"><i#}
                                    {#                                        class="mdi-navigation-chevron-right"></i></a></li>#}
                                {% else %}
                                    <li class="disabled"><a href="#!"><i class="mdi-navigation-chevron-right"></i></a>
                                    </li>
                                {% endif %}
                            </ul>

                        </div>
                    </div>
function nex(i) {

                            $("#page_numb2").val(i);
                            $("#first_form").submit();
                        }

希望这会有所帮助