中山币做网站公司百度安装到桌面

【Django】教程-1-安装+创建项目+目录结构介绍
【Django】教程-2-前端-目录结构介绍
【Django】教程-3-数据库相关介绍
【Django】教程-4-一个增删改查的Demo
【Django】教程-5-ModelForm增删改查+规则校验【正则+钩子函数】
【Django】教程-6-搜索框-条件查询前后端

13. 分页

使用django自带分页，以下 分页方式，支持多数场景。
也支持带条件框分页场景

# 用户列表
def user_list(req):"""用户展示"""# select * from userinfo order by name asc; -name 倒序# user_list = UserInfo.objects.all().order_by("-name")data_dict = {}query_name = req.GET.get("query_name", "") # 第二个值是默认值, 也可以写if判断if query_name:data_dict["name__contains"] = query_nameuser_list = UserInfo.objects.filter(**data_dict).order_by("-name")# 创建 Paginator 对象，每页显示 10 条记录paginator = Paginator(user_list, 10)# 获取当前页码，默认为第 1 页page_number = req.GET.get('page')# 获取当前页的数据page_obj = paginator.get_page(page_number)return render(req, 'user/user_list.html', {"search_data": query_name,'page_obj': page_obj})

{% extends 'layout.html' %}{% block content %}<div class="container"><div style="float: right;width: 300px;"><form method="get"><div class="input-group"><input type="text" class="form-control" placeholder="搜索" name="query_name"value="{{ search_data }}"/><span class="input-group-btn"><button class="btn btn-default" type="submit">查询</button></span></div></form></div><div style="margin-bottom: 10px"><a class="btn btn-success" href="/user/add"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新建用户</a></div><div style="margin-bottom: 10px"><a class="btn btn-success" href="/user/modelform/add"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span>ModelForm新建用户</a></div><div class="panel panel-default"><div class="panel-heading"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>用户列表</div><table class="table table-bordered"><thead><tr><th>#</th><th>姓名</th><th>密码</th><th>年龄</th><th>部门</th><th>创建时间</th><th>性别</th><th>状态</th><th>操作</th></tr></thead><tbody>{% for i in page_obj %}<tr><td>{{ i.id }}</td><td>{{ i.name }}</td><td class="password-cell">{{ i.password }}</td><td>{{ i.age }}</td><td>{% if i.depart %}{{ i.depart.title }}{% endif %}</td><td>{{ i.create_time|date:"Y-m-d H:i:s" }}</td><td>{{ i.get_gender_display }}</td><td>{{ i.get_status_display }}</td><td><a class="btn btn-primary btn-xs" href="/user/update/{{ i.id }}">编辑</a><a class="btn btn-primary btn-xs" href="/user/modelform/edit/{{ i.id }}">MF编辑</a><a class="btn btn-danger  btn-xs" href="/user/del?nid={{ i.id }}">删除</a></td></tr>{% endfor %}</tbody></table></div><!-- 分页导航 --><nav aria-label="分页"><ul class="pagination justify-content-center" style="display: flex; flex-wrap: nowrap; align-items: center;"><!-- 首页 -->{% if page_obj.has_previous %}<li class="page-item"><a class="page-link" href="?page=1">首页</a></li>{% else %}<li class="page-item disabled"><span class="page-link">首页</span></li>{% endif %}<!-- 上一页 -->{% if page_obj.has_previous %}<li class="page-item"><a class="page-link" href="?page={{ page_obj.previous_page_number }}">上一页</a></li>{% else %}<li class="page-item disabled"><span class="page-link">上一页</span></li>{% endif %}<!-- 下拉选择页码 --><li class="page-item" style="margin: 0 5px;"><select class="form-control" onchange="goToPage(this.value)">{% for page_num in page_obj.paginator.page_range %}<option value="{{ page_num }}" {% if page_num == page_obj.number %}selected{% endif %}>第 {{ page_num }} 页</option>{% endfor %}</select></li><!-- 显示当前页码和总页数 --><li class="page-item disabled" aria-current="page" style="margin: 0 5px;"><span class="page-link">共 {{ page_obj.paginator.num_pages }} 页</span></li><!-- 下一页 -->{% if page_obj.has_next %}<li class="page-item"><a class="page-link" href="?page={{ page_obj.next_page_number }}">下一页</a></li>{% else %}<li class="page-item disabled"><span class="page-link">下一页</span></li>{% endif %}<!-- 尾页 -->{% if page_obj.has_next %}<li class="page-item"><a class="page-link" href="?page={{ page_obj.paginator.num_pages }}">尾页</a></li>{% else %}<li class="page-item disabled"><span class="page-link">尾页</span></li>{% endif %}</ul></nav></div><script>const passwordCells = document.querySelectorAll('.password-cell');passwordCells.forEach(cell => {const password = cell.textContent;const maskedPassword = '*'.repeat(password.length);cell.textContent = maskedPassword;});function goToPage(page) {const searchParams = new URLSearchParams(window.location.search);searchParams.set('page', page);const newUrl = window.location.pathname + '?' + searchParams.toString();window.location.href = newUrl;}</script>{% endblock %}

效果图：