Django 前端BootCSS 实现分页
通过使用bootstrap框架，并配合Django自带的Paginator分页组件即可实现简单的分页效果。
1.创建MyWeb项目
python manage.py startapp MyWeb
2.修改settings.py配置文件,导入我们的app的名字，去掉csrf这个选项
# 屏蔽一项
MIDDLEWARE = [
#'django.middleware.csrf.CsrfViewMiddleware'
]
# 新增一项
TEMPLATES = [
'MyWeb.apps.MywebConfig'
]
3.来urls.py里面写一条路由，名字就叫index/映射到views.index函数下处理此请求
from MyWeb import views
urlpatterns = [
path('admin/', admin.site.urls),
path('index/', views.index)
]
4.最后在myweb里面的views.py设置一个视图函数,最后运行
from django.shortcuts import render
from django.shortcuts import HttpResponse
from MyWeb import models
def index(requests):
return HttpResponse("abcd")
5.配置数据库文件models.py并设置以下内容
from django.db import models
# 创建用户表
class User(models.Model):
id = models.AutoField(primary_key=True)
username = models.CharField(max_length=32)
password = models.CharField(max_length=32)
6.更新数据库与数据表
python manage.py makemigrations # 将你的数据库变动记录下来(并不会帮你创建表)
python manage.py migrate # 将你的数据库变动正在同步到数据库中
7.增加一个新的view并使用rand()函数.
首先在urls.py中增加路由
from django.contrib import admin
from django.urls import path
from MyWeb import views
urlpatterns = [
path('admin/', admin.site.urls),
path('index/',views.index),
path('rand/',views.rand)
]
其次在view.py视图中增加生成函数.
from django.shortcuts import render
from django.shortcuts import HttpResponse
from MyWeb import models
import random
# 首页
def index(requests):
return HttpResponse("abcd")
# 生成测试数据
def rand(request):
for i in range(1,1000):
chars = []
pasd = []
for x in range(1,8):
chars.append(random.choice('abcdefghijklmnopqrstuvwxyz'))
pasd.append(random.choice('0987654321'))
user = "".join(chars)
pwd = "".join(pasd)
models.User.objects.create(username=user, password=pwd)
return HttpResponse("ok")
启动django并访问http://127.0.0.1:8000/rand/等待数据生成结束.
8.在templates模板中，新增一个page.html页面。
<!--name: page.html-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="https://cdn.lyshark.com/bootstrap/4.5.0/css/bootstrap.min.css">
</head>
<body>
<table class="table table-sm table-hover">
<thead>
<tr class="table-success">
<th> 序号</th> <th> 用户名</th> <th> 用户密码</th>
</tr>
</thead>
<tbody>
{% for article in user_list %}
<tr class="table-primary">
<td>{{ article.id }}</td>
<td>{{ article.username }}</td>
<td>{{ article.password }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<nav class="d-flex justify-content-center" aria-label="Page navigation example">
<ul class="pagination">
<li class="page-item"><a class="page-link" href="./page?id=1">首页</a></li>
{% if user_list.has_previous %}
<li class="page-item"><a class="page-link" href="./page?id={{ user_list.previous_page_number }}">上一页</a></li>
{% else %}
<li class="page-item disabled"><a class="page-link" href="#">上一页</a></li>
{% endif %}
{% for item in page_range %}
{% if item == currentPage %}
<li class="page-item active"><a class="page-link" href="./page?id={{ item }}">{{ item }}</a></li>
{% else %}
<li class="page-item"><a class="page-link" href="./page?id={{ item }}">{{ item }}</a></li>
{% endif %}
{% endfor %}
{% if user_list.has_next %}
<li class="page-item"><a class="page-link" href="./page?id={{ user_list.next_page_number }}">下一页</a></li>
{% else %}
<li class="page-item disabled"><a class="page-link" href="#">下一页</a></li>
{% endif %}
<li class="page-item"><a class="page-link" href="./page?id={{ paginator.num_pages }}">尾页</a></li>
</ul>
</nav>
<div style="text-align: center;" class="alert alert-dark">
统计: {{ currentPage }}/{{ paginator.num_pages }} 共查询到:{{ paginator.count }} 条数据 页码列表:{{ paginator.page_range }}
</div>
</body>
</html>
9.最后在路由曾以及view中增加对应的URL以及路由函数.
首先在urls.py中增加一条新路由.
from django.contrib import admin
from django.urls import path
from MyWeb import views
urlpatterns = [
path('admin/', admin.site.urls),
path('index/',views.index),
path('rand/',views.rand),
path('page',views.page)
]
接着在views.py中增加一个page函数.
from django.shortcuts import render
from django.shortcuts import HttpResponse
from MyWeb import models
import random
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
# 首页
def index(requests):
return HttpResponse("abcd")
# 生成测试数据
def rand(request):
for i in range(1,1000):
chars = []
pasd = []
for x in range(1,8):
chars.append(random.choice('abcdefghijklmnopqrstuvwxyz'))
pasd.append(random.choice('0987654321'))
user = "".join(chars)
pwd = "".join(pasd)
models.User.objects.create(username=user, password=pwd)
return HttpResponse("ok")
# 分页函数
def page(request):
user = models.User.objects.all()
paginator = Paginator(user, 10)
currentPage = int(request.GET.get("id",1))
if paginator.num_pages > 15:
if currentPage-5 < 1:
pageRange = range(1,11)
elif currentPage+5 > paginator.num_pages:
pageRange = range(currentPage-5,paginator.num_pages)
else:
pageRange = range(currentPage-5,currentPage+5)
else:
pageRange = paginator.page_range
try:
user_list = paginator.page(currentPage)
except PageNotAnInteger:
user_list = paginator.page(1)
except:
user_list = paginator.page(paginator.num_pages)
return render(request,"page.html",{"user_list":user_list,
"paginator":paginator,
"page_range":pageRange,
"currentPage":currentPage})
准备就绪之后，直接访问http://127.0.0.1:8000/page即可看到分页显示效果.
Django 前端BootCSS 实现分页的更多相关文章
- python 学习笔记十八 django深入学习三 分页，自定义标签，权限机制
django Pagination(分页) django 自带的分页功能非常强大,我们来看一个简单的练习示例: #导入Paginator>>> from django.core.p ...
- python 全栈开发，Day87(ajax登录示例,CSRF跨站请求伪造,Django的中间件,自定义分页)
一.ajax登录示例 新建项目login_ajax 修改urls.py,增加路径 from app01 import views urlpatterns = [ path('admin/', admi ...
- Django Rest framework 之 分页
RESTful 规范 django rest framework 之 认证(一) django rest framework 之 权限(二) django rest framework 之 节流(三) ...
- django高级应用（分页功能）
django高级应用(分页功能) 1.原生分页应用 前端html代码 <!DOCTYPE html> <html lang="en"> <head&g ...
- django上课笔记2-视图CBV-ORM补充-Django的自带分页-Django的自定义分页
一.视图CBV 1.urls url(r'^login.html$', views.Login.as_view()), 2.views from django.views import View cl ...
- django cookie session 自定义分页
cookie cookie的由来 http协议是无状态的,犹如人生若只如初见,每次都是初次.由此我们需要cookie来保持状态,保持客户端和服务端的数据通信. 什么是cookie Cookie具体指的 ...
- Django基础06篇 分页
1.导入Django自带的分页类 from django.core.paginator import Paginator 2.分页类的使用 def index(request): # return H ...
- python模块，邮件推送交换机error级别以上log，django前端展示
前情概要 原syslog服务器只收集不推送日志,可以实时展示,服务器在海外内网,办公网做的有分流,到日志服务器的流量送到香港,其余流量国内,疫情期间在家办公,每次连接需要拨海外l2tp,挂着梯子访问国 ...
- django 前端请求跨域问题解决
django 前端请求跨域问题解决 笔者之前在做django-restful-api开发的时候,在前端请求页面发送请求的时候直接出现301,域名重定向的问题,经过一番查阅资料,终于得到了非常完美的解决 ...
随机推荐
- PTA 面向对象程序设计 7-1 2017Final 圆周率山
7-1 2017Final 圆周率山 为了参加学校的社团风采展,怡山小学数学组的同学们决定画一座圆周率山,以宣传圆周率. 已知圆周率为:3. 1415926535 8979323846 2643383 ...
- JavaScript对象的两类属性（数据属性与访问器属性）
对JavaScript来说,属性并非只是简单的名称和值,JavaScript用一组特征(attribute)来描述属性 (property). 第一类属性数据属性具有四个特征. value:就是属性的 ...
- cgroup之cpu关键参数
cpu.cfs_period_us specifies a period of time in microseconds (µs, represented here as "us" ...
- 使用python3中的2to3.py执行数据迁移
1.在python默认安装的位置找到Tools\scripts 2.找到2to3.py 3.在所在文件夹shift+右键打开终端 4.执行命令python 2to3.py -w 需要做数据迁移的数据路 ...
- 鸿蒙内核源码分析(中断管理篇) | 江湖从此不再怕中断 | 百篇博客分析OpenHarmony源码 | v44.02
百篇博客系列篇.本篇为: v44.xx 鸿蒙内核源码分析(中断管理篇) | 江湖从此不再怕中断 | 51.c.h .o 硬件架构相关篇为: v22.xx 鸿蒙内核源码分析(汇编基础篇) | CPU在哪 ...
- P4859-已经没有什么好害怕的了【容斥,dp】
正题 题目链接:https://www.luogu.com.cn/problem/P4859 题目大意 两个长度为\(n\)的序列\(a,b\)两两匹配,求\(a_i>b_i\)的组数比\(a_ ...
- NOI.AC#2139-选择【斜率优化dp,树状数组】
正题 题目链接:http://noi.ac/problem/2139 题目大意 给出\(n\)个数字的序列\(a_i\).然后选出一个不降子序列最大化子序列的\(a_i\)和减去没有任何一个数被选中的 ...
- MacOS Typora集成SM.SM图床 实现自动上传图片
MacOS Typora集成SM.SM图床 实现自动上传图片 此为PicGo-Core (Command line) (OpenSource)配置方法 参照官网 https://support.typ ...
- Unity——基于UGUI的UI框架
基于UGUI的UI框架 一.Demo展示 二.关键类 MonoSingle 继承MonoBehaviour的单例基类:做了一些特殊处理: 保证场景中必须有GameInit名称的物体,所有单例管理器脚本 ...
- 2020 年国内 Serverless 用户规模：阿里云占比第一，达 66%
在中国信息通信研究院重磅发布的国内首个<云原生用户调查报告>中,阿里云 Serverless 产品凭借在双十一的技术锤炼和丰富的应用实践,在国内 Serverless 用户规模的占比达到 ...