django高级应用（分页功能）

1、原生分页应用

前端html代码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <ul>
 9         {% for item in posts.object_list %}
10             <li>{{ item.name }}- {{ item.age }}</li>
11         {% endfor %}
12     </ul>
13     {% include 'include/pages.html' %}
14 </body>
15 </html>
16 
17 
18 #include/pages.html
19 
20 {% if posts.has_previous %}
21     <a href="/index1.html?p={{ posts.previous_page_number }}">上一页</a>
22 {% else %}
23     <a href="#">上一页</a>
24 {% endif %}
25 
26 {% if posts.has_next %}
27     <a href="/index1.html?p={{ posts.next_page_number }}">下一页</a>
28 {% endif %}
29 <span>
30     {{ posts.number }}/{{ posts.paginator.num_pages }}
31 </span>

前端html代码

django后台代码

 1 from django.shortcuts import render
 2 from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
 3 
 4 USER_LIST = []
 5 for i in range(1, 999):
 6     temp = {'name': 'root' + str(i), 'age': i}
 7     USER_LIST.append(temp)
 8 
 9 def index1(request):
10     # 全部数据：USER_LIST，=》得出共有多少条数据
11     # per_page: 每页显示条目数量
12     # count:    数据总个数
13     # num_pages:总页数
14     # page_range:总页数的索引范围，如: (1,10),(1,200)
15     # page:     page对象（是否具有下一页；是否有上一页；）
16     current_page = request.GET.get('p')
17     # Paginator对象
18     paginator = Paginator(USER_LIST, 10)
19     #paginator = CustemPaginator(current_page, 11, USER_LIST, 10)
20     try:
21         posts = paginator.page(current_page)
22         # has_next              是否有下一页
23         # next_page_number      下一页页码
24         # has_previous          是否有上一页
25         # previous_page_number  上一页页码
26         # object_list           分页之后的数据列表，已经切片好的数据
27         # number                当前页
28         # paginator             paginator对象
29     except PageNotAnInteger:
30         posts = paginator.page(1)
31     except EmptyPage:
32         posts = paginator.page(paginator.num_pages)
33     return render(request, "index1.html", {"posts": posts})
34 
35 django后台代码

django后台代码

缺点：功能少，例如显示页面范围等。

2、自定制添加显示页面范围的功能

 1 {% if posts.has_previous %}
 2     <a href="/index1.html?p={{ posts.previous_page_number }}">上一页</a>
 3 {% else %}
 4     <a href="#">上一页</a>
 5 {% endif %}
 6 
 7 {% for i in posts.paginator.page_num_range %}
 8     {% if i == posts.number %}
 9         <a style="font-size: 20px" href="/index1.html?p={{ i }}">{{ i }}</a>
10     {% else %}
11         <a href="/index1.html?p={{ i }}">{{ i }}</a>
12     {% endif %}
13 {% endfor %}
14 
15 {% if posts.has_next %}
16     <a href="/index1.html?p={{ posts.next_page_number }}">下一页</a>
17 {% endif %}
18 <span>
19     {{ posts.number }}/{{ posts.paginator.num_pages }}
20 </span>

前端html代码

django后台代码

 1 from django.shortcuts import render
 2 from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
 3 
 4 USER_LIST = []
 5 for i in range(1, 999):
 6     temp = {'name': 'root' + str(i), 'age': i}
 7     USER_LIST.append(temp)
 8 
 9 class CustemPaginator(Paginator):
10     """
11     是自定制django分页类的方法
12     :page_num_range 显示返回页数范围
13     :current_page  当前页数
14     :max_page_num 最大显示的页码数
15     """
16     def __init__(self, current_page, max_pager_num, *args, **kwargs):
17         # 当前页
18         self.current_page = int(current_page)
19         # 最多显示的页码数量
20         self.max_pager_num = int(max_pager_num)
21         super(CustemPaginator,self).__init__(*args, **kwargs)
22 
23     def page_num_range(self):
24         # 当前页
25         # self.current_page
26         # 最多显示的页码数量 11
27         # self.per_pager_num
28         # 总页数
29         # self.num_pages
30 
31         # 判断如果页面总数量小于显示页面的总数量，那么返回最大的页面总数量。
32         if self.num_pages < self.max_pager_num:
33             return range(1, self.num_pages + 1)
34         part = int(self.max_pager_num / 2)
35 
36         # 判断当前页小于等于最大显示页的一半，那么返回1到最大显示页数量。
37         if self.current_page <= part:
38             return range(1, self.max_pager_num + 1)
39 
40         # 当选择页数加上显示页数的一半的时候，说明越界了，例如最大也数是15，显示页数是10，我选择11页，那么11+5等于16，大于15，那么就显示总页数15-11+1，15+1
41         if (self.current_page + part) > self.num_pages:
42             # 那么返回总页数前去当前显示页数个数+1的值，和总页数+1的值。
43             return range(self.num_pages - self.max_pager_num + 1, self.num_pages + 1)
44 
45         # 当选择页大于当前总页数的一半的时候，返回当前选择页的前五个和后五个页数。
46         return range(self.current_page - part, self.current_page + part + 1)
47 
48 
49 def index1(request):
50     # 全部数据：USER_LIST，=》得出共有多少条数据
51     # per_page: 每页显示条目数量
52     # count:    数据总个数
53     # num_pages:总页数
54     # page_range:总页数的索引范围，如: (1,10),(1,200)
55     # page:     page对象（是否具有下一页；是否有上一页；）
56     current_page = request.GET.get('p')
57     # Paginator对象
58     # paginator = Paginator(USER_LIST, 10)
59     paginator = CustemPaginator(current_page, 11, USER_LIST, 10)
60     try:
61         posts = paginator.page(current_page)
62         # has_next              是否有下一页
63         # next_page_number      下一页页码
64         # has_previous          是否有上一页
65         # previous_page_number  上一页页码
66         # object_list           分页之后的数据列表，已经切片好的数据
67         # number                当前页
68         # paginator             paginator对象
69     except PageNotAnInteger:
70         posts = paginator.page(1)
71     except EmptyPage:
72         posts = paginator.page(paginator.num_pages)
73     return render(request, "index1.html", {"posts": posts})

django后台代码

3、自定制分页模块

  1 # -*- coding: utf-8 -*-
  2 # @Time    : 2017/7/4
  3 # @Author  : Ocean.Pan
  4 
  5 class Pagination(object):
  6     def __init__(self,current_page,total_page_count,per_page_item_num=10,max_page_num=7,page_url=None):
  7         # 当前页
  8         self.current_page = current_page
  9         try:
 10             v = int(current_page)
 11             if v <= 0:
 12                 v = 1
 13             self.current_page = v
 14         except Exception as e:
 15             self.current_page = 1
 16         # 数据总个数
 17         self.total_page_count = total_page_count
 18         # 每一页显示的页面元素个数
 19         self.per_page_item_num = per_page_item_num
 20         # 最大显示页码
 21         self.max_page_num = max_page_num
 22         self.page_url = page_url
 23 
 24     def start_page_item(self):
 25         '''
 26         开始显示的页面元素，即从第几个页面链接开始显示
 27         :return: 当前页减一乘以每个页面最多显示元素个数
 28         '''
 29         return (self.current_page-1) * self.per_page_item_num
 30 
 31     def end_page_item(self):
 32         '''
 33         结束显示的页面元素，即最后一个页面元素的显示
 34         :return: 当前页乘以每个页面显示的最大元素个数
 35         '''
 36         return self.current_page * self.per_page_item_num
 37 
 38     # @property 是让num_pages变成以静态属性方式访问。
 39     @property
 40     def num_pages(self):
 41         '''
 42         总页码数量
 43         :return: 当b为零的时候代表是可整除的，a就是返回值，当不能整除时a+1返回。
 44         '''
 45         a,b = divmod(self.total_page_count,self.per_page_item_num)
 46         if b == 0:
 47             return a
 48         return a+1
 49 
 50     def page_num_range(self):
 51         '''
 52         页码的显示范围
 53         :return:
 54         '''
 55 
 56         # 判断如果页面总数量小于显示页面的总数量，那么返回最大的页面总数量。
 57         if self.num_pages < self.max_page_num:
 58             return range(1, self.max_page_num + 1)
 59         part = int(self.max_page_num / 2)
 60 
 61         # 判断当前页小于等于最大显示页的一半，那么返回1到最大显示页数量。
 62         if self.current_page <= part:
 63             return range(1, self.max_page_num + 1)
 64 
 65         # 当选择页数加上显示页数的一半的时候，说明越界了，例如最大也数是15，显示页数是10，我选择11页，那么11+5等于16，大于15，那么就显示总页数15-11+1，15+1
 66         if (self.current_page + part) > self.num_pages:
 67             # 那么返回总页数前去当前显示页数个数+1的值，和总页数+1的值。
 68             return range(self.num_pages - self.max_page_num + 1, self.num_pages + 1)
 69 
 70         # 当选择页大于当前总页数的一半的时候，返回当前选择页的前五个和后五个页数。
 71         return range(self.current_page - part, self.current_page + part + 1)
 72 
 73     def page_str(self):
 74         page_list=[]
 75         first = "<li><a href='/%s?p=1'>首页</a></li>" % (self.page_url,)
 76         page_list.append(first)
 77 
 78         if self.current_page == 1:
 79             prev = "<li><a href='#'>上一页</a></li>"
 80         else:
 81             prev = "<li><a href='/%s?p=%s'>上一页</a></li>" % (self.page_url,self.current_page - 1)
 82         page_list.append(prev)
 83 
 84         for i in self.page_num_range():
 85             if i == self.current_page:
 86                 temp = "<li class='active'><a href='/%s?p=%s'>%s</a></li>" %(self.page_url,i,i)
 87             else:
 88                 temp = "<li><a href='/%s?p=%s'>%s</a></li>" % (self.page_url,i, i)
 89             page_list.append(temp)
 90 
 91         if self.current_page == self.num_pages:
 92             nex = "<li><a href='#'>下一页</a></li>"
 93         else:
 94             nex = "<li><a href='/%s?p=%s'>下一页</a></li>" % (self.page_url,self.current_page + 1)
 95         page_list.append(nex)
 96 
 97         last = "<li><a href='/%s?p=%s'>尾页</a></li>" %(self.page_url,self.num_pages)
 98         page_list.append(last)
 99 
100         return ''.join(page_list)

分页模块后端代码

 1 from app01.paging import Pagination
 2 
 3 USER_LIST = []
 4 for i in range(1, 999):
 5     temp = {'name': 'root' + str(i), 'age': i}
 6     USER_LIST.append(temp)
 7 
 8 def index2(request):
 9     current_page = request.GET.get('p')
10     page_obj = Pagination(current_page,999,page_url="index2.html")
11     data_list = USER_LIST[page_obj.start_page_item():page_obj.end_page_item()]
12     return render(request,"index2.html",{"data":data_list,"page_obj":page_obj})

分页模块视图部分

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/plugins/bootstrap/css/bootstrap.css"/>
</head>
<body>
    <ul>
        {% for item in data %}
            <li>{{ item.name }}- {{ item.age }}</li>
        {% endfor %}
    </ul>
    <ul class="pagination pagination-sm">
        {{ page_obj.page_str|safe }}
    </ul>
</body>
</html>

前端展示