#从数据库取出符合条件的数据进行分页
qs_goods = Goods.objects.filter(name__icontains=keyword,is_delete=False).order_by('id')
page_size=3 #每页显示3条数据
my_paginator = Paginator(qs_goods,page_size)
# 求总页码
sum_page = my_paginator.num_pages
#当前页对象,如果我们把最后一页删除了会导致找不到页码报错
try: #如果报错
my_page = my_paginator.page(page_now)
except:#如果不是第一页就跳到下一页,如果是第一页就正常往下走
# 如果get输入访问,page>总页数让page = 最后一页
if page_now > sum_page:
page_now = sum_page
return redirect('/store/list_goods/?page={}&keyword={}'.format(page_now, keyword))
if page_now < sum_page and page_now > 1:
return redirect('/store/list_goods/?page={}&keyword={}'.format(page_now-1,keyword))
else:
page_now = 1
return redirect('/store/list_goods/?page={}&keyword={}'.format(page_now, keyword))
#设置显示出的页数
num = 3 #实际显示出num * 2 + 1 个页码
# 当前页减num 是 如果请求的当前页是5,那么前面会显示5-num 个页码
start = page_now - num
if start <= 0:
start = 1
# 当前页减num 是 如果请求的当前页是5,那么后面会显示5+num 个页码,加上当前页总共就显示出11个页码
end = page_now + num
# 实际显示出num * 2 + 1 个页码 ,所以结尾加开头必须保持一致,前num个开头结尾是不相等的,当不相等事给end重新赋值
if end - start != num * 2 + 1:
end = start + num * 2
# 获取所有页数
page_range = my_paginator.page_range[start-1:end] #显示出的页码是奇数
# page_range = my_paginator.page_range[start - 1:end - 1] #显示出的页码是偶数
#获取当前页的数据内容
list_goods = my_page.object_list
#获取数据的总个数
count = my_paginator.count
#第一条数据的开始编码(数据的顺序)
sign_start = (page_now - 1) * page_size + 1
#最后一条
sign_end = page_now * page_size
if sign_end > count:
sign_end = count
#拼接编码
for index,good in enumerate(list_goods):
good.num = sign_start + index
data = {
'list_goods':list_goods,
'keyword':keyword,
'page_now':page_now,
'my_page':my_page,
'page_range':page_range,
'page_size':page_size,
'count':count,
'sum_page':sum_page,
}
#渲染到前端
return render(request, 'store/list_goods.html', data)
前端其中的类名是外链js设置的样式,没有js是没有样式的
{# 页码 #}
<div class="panel-footer">
<div class="row">
<div class="col-lg-4"> {# {{ my_page.start_index}} 当前页第一条数据的索引 {{ my_page.end_index}} 当前页最后一条数据的索引 #}
<div class="dataTables_info pagination" id="dataTables-example_info" role="status"
aria-live="polite">Showing {{ my_page.start_index}} to {{ my_page.end_index}} of {{ count }} entries {{ page_now }}/{{ sum_page }}
</div>
</div>
<div class="col-lg-8 text-right">
<div class="dataTables_paginate paging_simple_numbers" id="dataTables-example_paginate">
<ul class="pagination">
{# 如果有上一页 #}
{% if my_page.has_previous%}
<li class="paginate_button previous " aria-controls="dataTables-example"
tabindex="0" id="dataTables-example_previous">
<a href="/store/list_goods/?page={{ page_now|add:'-1' }}&keyword={{ keyword }}">Previous</a></li>
{% else %} {# 如果没有上一页禁用上一页按钮 #}
<li class="paginate_button previous disabled" aria-controls="dataTables-example"
tabindex="0" id="dataTables-example_previous">
<a href="#" class="my_a_disabed">Previous</a></li>
{% endif %}
{# 页码遍历 #}
{% for page in page_range %}
{# 如果是请求页等于当前页,添加背景颜色 #} {# page_now 是字符串时候会出错,不可以比较 #}
{% ifequal page page_now %}
<li class="paginate_button active" aria-controls="dataTables-example" tabindex="0"><a
href="/store/list_goods/?page={{ page }}&keyword={{ keyword }}">{{ page }}</a></li>
{% else %}
<li class="paginate_button" aria-controls="dataTables-example" tabindex="0"><a
href="/store/list_goods/?page={{ page }}&keyword={{ keyword }}">{{ page }}</a></li>
{% endifequal %}
{% endfor %}
{# 如果有下一页 #}
{% if my_page.has_next %}
<li class="paginate_button next" aria-controls="dataTables-example" tabindex="0"
id="dataTables-example_next"><a href="/store/list_goods/?page={{ page_now|add:'1' }}&keyword={{ keyword }}">Next</a></li>
{% else %} {# 如果没有下一页禁用按钮 #}
<li class="paginate_button next disabled" aria-controls="dataTables-example" tabindex="0"
id="dataTables-example_next"><a href="#" class="my_a_disabed">Next</a></li>
{% endif %}
</ul>
</div>
</div>
</div>
</div>
使用编号
**另一种序号方法:**
my_paginator = Paginator(qs_goods,page_size)
my_page = my_paginator.page(page_now)
在循环遍历中:forloop.counter是计算遍历的次数的,一页遍历循环一次,例如每页显示5条forloop.counter就从1-5,( forloop.counter0 是从0开始计数)就是0-4。
而 my_page.start_index 是第一条数据的序号,
所以可以是这样 my_page.start_index|add: forloop.counter0
![!\[在这里插入图片描述\](https://img-blog.csdnimg.cn/20190910230940566.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Bhbmp1bnhpYW8=,size_16,color_FFFFFF,t_7](https://img-blog.csdnimg.cn/20190910232217142.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/2019091023240834.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Bhbmp1bnhpYW8=,size_16,color_FFFFFF,t_70)