>> from django.core..."/>
溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

Django html 分頁(yè)

發(fā)布時(shí)間:2020-08-10 23:43:14 來源:網(wǎng)絡(luò) 閱讀:921 作者:lvnian2009 欄目:開發(fā)技術(shù)


16.分頁(yè)

django 自帶的分頁(yè):django paginator

參考:https://docs.djangoproject.com/en/1.10/topics/pagination/

>>> from django.core.paginator import Paginator
>>> objects = ['john', 'paul', 'george', 'ringo']
>>> p = Paginator(objects, 2)

>>> p.count
4
>>> p.num_pages     ##一共多少頁(yè),也可說是最后一頁(yè)的頁(yè)數(shù)
2
>>> p.page_range
[1, 2]
>>>

>>> page1 = p.page(1)
>>> page1
<Page 1 of 2>
>>> page1.object_list
['john', 'paul']

>>> page2 = p.page(2)
>>> page2.object_list
['george', 'ringo']
>>> page2.has_next()
False
>>> page2.has_previous()
True
>>> page2.has_other_pages()
True
>>> page2.next_page_number()
Traceback (most recent call last):
...
EmptyPage: That page contains no results
>>> page2.previous_page_number()
1
>>> page2.start_index() # The 1-based index of the first item on this page
3
>>> page2.end_index() # The 1-based index of the last item on this page
4
>>> p.page(0)
Traceback (most recent call last):
...
EmptyPage: That page number is less than 1
>>> p.page(3)
Traceback (most recent call last):
...
EmptyPage: That page contains no results

###################################
###################################
###################################  后端處理
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
from django.shortcuts import render

def listing(request):
    contact_list = Contacts.objects.all()     ###把內(nèi)容取出來,但不是真正取出去。
    paginator = Paginator(contact_list, 25) # Show 25 contacts per page

    page = request.GET.get('page')         ##前臺(tái)說要去那一頁(yè),就提交到這
    try:
        contacts = paginator.page(page)
    except PageNotAnInteger:
        # If page is not an integer, deliver first page.     ##如果頁(yè)面不是一個(gè)整數(shù),交付第一頁(yè)
        contacts = paginator.page(1)
    except EmptyPage:
        # If page is out of range (e.g. 9999), deliver last page of results.
        contacts = paginator.page(paginator.num_pages)         ##如果取的頁(yè)數(shù)超過最大頁(yè)數(shù),就返回最后一頁(yè)

    return render(request, 'list.html', {'contacts': contacts})    ##把獲取到的頁(yè)面返回到前臺(tái)



###################################
###################################
###################################  前端處理

{% for contact in contacts %}
    {# Each "contact" is a Contact model object. #}
    {{ contact.full_name|upper }}<br />
    ...
{% endfor %}

<div class="pagination">
    <span class="step-links">
        {% if contacts.has_previous %}      ##判斷后端傳來的頁(yè)數(shù),有沒有上一頁(yè)
            <a href="?page={{ contacts.previous_page_number }}">previous</a>
        {% endif %}

        <span class="current">
            Page {{ contacts.number }} of {{ contacts.paginator.num_pages }}.
        </span>

        {% if contacts.has_next %}  ##判斷后端傳來的頁(yè)數(shù),有沒有下一頁(yè)
            <a href="?page={{ contacts.next_page_number }}">next</a>
        {% endif %}    ### ?page ,加上'?'問號(hào)。 就是一個(gè)get方法。
    </span>
</div>


###################################
###################################
###################################  前端處理,用bootstrap 實(shí)現(xiàn), 作業(yè):線上分頁(yè)中的前后幾頁(yè),而不是下面的全部頁(yè)面都顯示

                    <nav>
                      <ul class="pagination">
                      {% if articles.has_previous %}
                        <li>
                            <a href="?page={{ articles.previous_page_number }}" aria-label="Previous">
                                <span aria-hidden="true">
                                    &laquo;
                                </span>
                            </a>
                        </li>
                      {% else %}
                        <li>
                            <a href="#" aria-label="Previous">
                                <span aria-hidden="true">
                                    &laquo;
                                </span>
                            </a>
                        </li>

                      {% endif %}

                      {% for p_num in articles.paginator.page_range %}
                        {% if articles.number == p_num %}
                        <li class="active">
                            <a href="#">
                                {{ articles.number }}
                                <span class="sr-only">{{ articles.number }}
                                </span>
                            </a>
                        </li>
                        {% else %}
                        <li >
                            <a href="?page={{ p_num }}">
                                {{ p_num }}
                            </a>
                        </li>
                        {% endif %}
                       {% endfor %}
                        {% if articles.has_next %}
                        <li>
                            <a href="?page={{ articles.next_page_number }}" aria-label="Next">
                                <span aria-hidden="true">
                                    &raquo;
                                </span>
                            </a>
                        </li>
                        {% else %}
                        <li>
                            <a href="#" aria-label="Next">
                                <span aria-hidden="true">
                                    &raquo;
                                </span>
                            </a>
                        </li>
                      {% endif %}
                      </ul>
                    </nav>



下面這個(gè)實(shí)例,分頁(yè)頁(yè)面按鈕數(shù)最多顯示為3個(gè)!

實(shí)例:
后端:
def index(request):   ##分頁(yè)
    articles_list = models.Article.objects.all().order_by('-publish_date')  ###把內(nèi)容取出來,但不是真正取出去。
    paginator = Paginator(articles_list, 2) # Show 2 contacts per page

    page = request.GET.get('page')     ##前臺(tái)說要去那一頁(yè),就提交到這
    try:
        articles = paginator.page(page)
    except PageNotAnInteger:
        # If page is not an integer, deliver first page.  ##如果頁(yè)面不是一個(gè)整數(shù),交付第一頁(yè)
        articles = paginator.page(1)
    except EmptyPage:
        # If page is out of range (e.g. 9999), deliver last page of results.
        articles = paginator.page(paginator.num_pages) ##如果取的頁(yè)數(shù)超過最大頁(yè)數(shù),就返回最后一頁(yè)

    page_range = range(articles.number - 1 ,articles.number + 2)
    max_page = paginator.num_pages
    return render(request,'index.html',{
        'articles': articles,
        'page_range': page_range,
        'max_page': max_page,
    })

前端:
<div class="pagination">
<ul class="pagination">
    {% if articles.has_previous %}
        <li><a href="?page={{ articles.previous_page_number }}">previous</a>
        </li>
    {% endif %}

    {% for p_num in page_range %}
        {% if 0 < p_num and p_num < max_page %}
            {% if articles.number == p_num %}
                <li class="active">
                <a href="#">
                {{ articles.number }}
                <span class="sr-only">{{ articles.number }}
                </span>
                </a>
                </li>
            {% else %}
                <li >
                <a href="?page={{ p_num }}">
                    {{ p_num }}
                </a>
                </li>
            {% endif %}
        {% endif %}
    {% endfor %}
    
    
    {% if articles.has_next %}
        <li><a href="?page={{ articles.next_page_number }}">next</a></li>
    {% endif %}
</ul>
</div>
<div class="pagination">
<ul class="pagination">
    {% if articles.has_previous %}
        <li><a href="?page={{ articles.previous_page_number }}">&laquo;</a>
        </li>
    {% else %}
        <li class="disabled"><a href="?page={{ articles.next_page_number }}">&laquo;</a></li>
    {% endif %}

    {% for p_num in page_range %}
        {% if 0 < p_num and p_num < max_page %}
            {% if articles.number == p_num %}
                <li class="active">
                <a href="#">
                {{ articles.number }}
                <span class="sr-only">{{ articles.number }}
                </span>
                </a>
                </li>
            {% else %}
                <li >
                <a href="?page={{ p_num }}">
                    {{ p_num }}
                </a>
                </li>
            {% endif %}
        {% endif %}
    {% endfor %}


    {% if articles.has_next %}
        <li><a href="?page={{ articles.next_page_number }}">&raquo;</a></li>
        {% else %}
        <li class="disabled"><a href="?page={{ articles.next_page_number }}">&raquo;</a></li>
    {% endif %}
</ul>
</div>


向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI