django list類型數據分頁


一、概述

有一個django項目,由於業務要求,自己構造了一個list數據類型。這是一個臨時數據,不需要保存到表中,但是需要分頁展示。

由於之前學習的Django的分頁器(paginator),參考鏈接:

https://www.cnblogs.com/xiao987334176/p/9285629.html

它是針對於queryset類型做的分頁,那么list類型是否也可以呢?答案是可以的!

 

二、項目測試

新建項目paging_demo

本文使用的django版本為2.x系列

 

paging_demo/urls.py

from django.contrib import admin
from django.urls import path
from application import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', views.index),
]
View Code

 

paging_demo/settings.py ,最后一行增加

# 每一頁顯示幾條
PAGE_SIZE = 10
# 分頁數
PAGE_NUM_PAGES = 11

 

application/views.py

from django.shortcuts import render
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
from paging_demo import settings


# Create your views here.
def index(request):
    """
    首頁
    :param request:
    :return:
    """
    host_list = []
    for i in range(100):
        dic = {"id":i,"ip":"192.168.1.%s"%i}
        host_list.append(dic)


    # 分頁
    paginator = Paginator(host_list, settings.PAGE_SIZE)  # 每頁顯示指定的條數

    # 異常判斷
    try:
        # 當前頁碼,如果取不到page參數,默認為1
        current_num = int(request.GET.get("page", 1))  # 當前頁碼
        host_list = paginator.page(current_num)  # 獲取當前頁碼的數據
    except EmptyPage:  # 頁碼不存在時,報EmptyPage錯誤
        log_list = paginator.page(1)  # 強制更新為第一頁

    #  如果頁數十分多時,換另外一種顯示方式
    if paginator.num_pages > settings.PAGE_NUM_PAGES:  # 一般網頁展示11頁,左5頁,右5頁,加上當前頁,共11頁
        if current_num - 5 < 1:  # 如果前5頁小於1時
            pageRange = range(1, settings.PAGE_NUM_PAGES)  # 頁碼的列表:范圍是初始狀態
        elif current_num + 5 > paginator.num_pages:  # 如果后5頁大於總頁數時
            # 頁碼的列表:范圍是(當前頁-5,總頁數+1)。因為range顧頭不顧尾,需要加1
            pageRange = range(current_num - 5, paginator.num_pages + 1)
        else:
            # 頁碼的列表:后5頁正常時,頁碼范圍是(當前頁-5,當前頁+6)。注意不是+5,因為range顧頭不顧尾!
            pageRange = range(current_num - 5, current_num + 6)
    else:
        pageRange = paginator.page_range  # 頁碼的列表

    data = {
        "paginator": paginator, "current_num": current_num, "pageRange": pageRange,
        "host_list": host_list
    }
    return render(request, "index.html", data)
View Code

 

templates/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>

<div class="container">
    <div class="row">
        <div class="panel panel-success">
            <!-- Default panel contents -->
            <div class="panel-heading text-center">
                <span>主機列表</span>
            </div>
            <!-- Table -->
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>序號</th>
                    <th>ip地址</th>
{#                    <th>操作</th>#}
                </tr>
                </thead>
                <tbody>
                {% for item in host_list %}
                    <tr>
                        <th>
                            <span>{{ forloop.counter }}</span>
                        </th>
                        <td>{{ item.ip }}</td>
                    </tr>
                {% endfor %}

                </tbody>
            </table>

        </div>

        {#分頁展示#}
        <nav aria-label="Page navigation">
            <ul class="pagination">
                <li><a href="?page=1" aria-label="Previous"><span aria-hidden="true">首頁</span></a></li>

                {#has_previous 判斷是否有上一頁#}
                {% if host_list.has_previous %}
                    {#previous_page_number 上一頁的頁碼#}
                    <li><a href="?page={{ host_list.previous_page_number }}" aria-label="Previous"><span
                            aria-hidden="true">上一頁</span></a></li>
                {% else %}
                    {#class="disabled" 禁止用戶點擊#}
                    <li class="disabled"><a href="" aria-label="Previous"><span aria-hidden="true">上一頁</span></a></li>
                {% endif %}

                {#遍歷頁碼的列表#}
                {% for i in pageRange %}
                    {#判斷當前頁碼數等於底部頁碼時#}
                    {% if current_num == i %}
                        {#增加class,加深按鈕#}
                        <li class="active"><a href="?page={{ i }}">{{ i }}</a></li>
                    {% else %}
                        {#href參數為簡寫,它會自動獲取當前路徑,並拼接參數#}
                        <li><a href="?page={{ i }}">{{ i }}</a></li>
                    {% endif %}

                {% endfor %}

                {#has_next 判斷是否有下一頁#}
                {% if host_list.has_next %}
                    {#next_page_number 下一頁的頁碼#}
                    <li><a href="?page={{ host_list.next_page_number }}" aria-label="Next"><span
                            aria-hidden="true">下一頁</span></a></li>
                {% else %}
                    {#class="disabled" 禁止用戶點擊#}
                    <li class="disabled"><a href="" aria-label="Next"><span aria-hidden="true">下一頁</span></a></li>
                {% endif %}

                <li><a href="?page={{ paginator.num_pages }}" aria-label="Next"><span aria-hidden="true">最后一頁</span></a>
                </li>

            </ul>
        </nav>
    </div>
</div>

</body>
</html>
View Code

 

運行項目,訪問頁面:

http://127.0.0.1:8000/

 

效果如下:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM