Django 简单实现分页与搜索功能的示例代码

作者：s_kangkang_A 时间：2023-12-26 01:40:16　

假设现有需求如下：

需要一个页面分页展示信息，在该页面添加搜索框以提供检索功能。

那么，我们知道，展示信息和检索功能是在同一个页面，也就是共用一个路由。

代码如下：

第一步，写路由：为了清晰，这里只给出主页和展示页面的路由。

urls.py：

from django.urls import path
from . import views
from django.conf.urls.static import static
from django.conf import settings
from django.contrib.staticfiles.urls import staticfiles_urlpatterns

# from django.contrib import staticfiles

urlpatterns = [
# 主页
path('', views.index),

# 访问他人信息入口，分页展示
path('other/profile', views.request_user),

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
urlpatterns += staticfiles_urlpatterns()

第二步，写视图：这里做了访问限制，登录才能访问

views.py：

from django.contrib.auth.decorators import login_required
from django.shortcuts import render, redirect
from django.http import HttpResponseRedirect, HttpResponse
from django.contrib.auth import authenticate, login, logout
from .models import UserInfo, Email_Message, Wastes
from django.contrib.auth.models import AnonymousUser
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger

@login_required(login_url='/tologin')
def request_user(request):
# 实现搜索
key = request.GET.get('key')
all_users = UserInfo.objects.filter(cate="买家").all()
userlist = []
# 如果前端传入关键字，才会进行检索，否则显示全部买家
if key:
for user in all_users:
if key in user.address:
userlist.append(user)
all_users = userlist
if all_users:
paginator = Paginator(all_users, 2)
page = request.GET.get('page')
try:
contacts = paginator.page(page)
except PageNotAnInteger:
contacts = paginator.page(1)
except EmptyPage:
contacts = paginator.page(paginator.num_pages)
return render(request, 'Myapp/userlist.html', {'contacts': contacts})
else:
info = '暂无数据'
return render(request, 'Myapp/userlist.html', {'info': info})

分页的原理是用到了django自带的分页组件

需要注意的是，搜索的关键字传参，用的是GET请求，而不是POST请求

简单来说，就是先判断前端页面是否用搜索框搜索了关键字，如果搜索了，那么这个词会被

key = request.GET.get('key')

赋值给key，然后进行后续判断处理即可。

如果没有，就正常展示我们需要展示的。

分页的原理。

可以去看这个组件的文档介绍。

如果返回的key检索不到结果，返回空数据页，并提醒。

html代码：

{％ load static ％}




<html lang="en"> 
<head>


<link rel='shortcut icon' href="{％ static 'Myapp/img/favicon.con' ％}" rel="external nofollow" type="image/x-icon"/>


<meta charset="utf-8">
<title>Detail</title>
<meta name="description" content="">
<meta name="author" content="">


<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">


<link rel="stylesheet" href="{％ static 'Myapp/css/zerogrid.css' ％}" rel="external nofollow" >
<link rel="stylesheet" href="{％ static 'Myapp/css/style.css' ％}" rel="external nofollow" >
<link rel="stylesheet" href="{％ static 'Myapp/css/lightbox.css' ％}" rel="external nofollow" >


<link href="{％ static 'Myapp/assets/css/font-awesome.min.css' ％}" rel="external nofollow" rel="stylesheet" type="text/css">

<link rel="stylesheet" href="{％ static 'Myapp/css/menu.css' ％}" rel="external nofollow" >
<link rel="stylesheet" href="{％ static 'Myapp/assets/css/bootstrap.min.css' ％}" rel="external nofollow" >
<script src="{％ static 'Myapp/js/jquery1111.min.js' ％}" type="text/javascript"></script>
<script src="{％ static 'Myapp/js/script.js' ％}"></script>




</head>

<body>
<div class="wrap-body">


<header class="zerogrid">
<div class="logo"><img src="{％ static 'Myapp/img/logo.png' ％}" alt=""/></div>
<div id='cssmenu' class="align-center">
<ul>
<li><a href='http://127.0.0.1:8000/'><span>主页</span></a></li>
<li><a href='http://127.0.0.1:8000/about'><span>关于我们</span></a></li>
<li><a href='http://127.0.0.1:8000/show_detail'><span>每日看价</span></a></li>
<li><a href='http://127.0.0.1:8000/other/profile'><span>找个买家</span></a></li>
<li class='last'><a href='http://127.0.0.1:8000/contact'><span>联系我们</span></a></li>
</ul>
</div>
<form style="float: right">
{％ csrf_token ％}
<label>
<div class="form-group">
<input type="search" class="form-control" name="key" placeholder="您可输入所在城市以检索买家">
</div>
</label>
<input class="btn btn-default" type="submit" value="搜索">
</form>
</header>


<div style="text-align: center">
<table style="float: contour; margin:0 auto;text-align: center; width: 800px;" class="table table-bordered">
<tr style="text-align: center" class="success">
<td>昵称</td>
<td>地址</td>
<td>最近活跃</td>
</tr>
{％ for u in contacts ％}
<tr class="info">
<td><a
href="http://127.0.0.1:8000/other/profile/{{ u.username }}" rel="external nofollow" >{{ u.username }}</a>
</td>
<td>{{ u.address }}</td>
<td>{{ u.last_login }}</td>
</tr>
{％ endfor ％}
</table>
</div>

<div class="navigation">
<ul>
{％ for pg in contacts.paginator.page_range ％}
{％ if contacts.number == pg ％}
<li class="active"><a href="?page={{ pg }}" rel="external nofollow" rel="external nofollow" >{{ pg }}</a></li>
{％ else ％}
<li><a href="?page={{ pg }}" rel="external nofollow" rel="external nofollow" >{{ pg }}</a></li>
{％ endif ％}
{％ endfor ％}

{％ if contacts.has_next ％}
<li><a href="?page={{ contacts.next_page_number }}" rel="external nofollow" >下一页</a></li>
{％ endif ％}
</ul>
</div>


</div>
{％ if info ％}
<script>
window.alert('{{ info }}');
</script>
{％ endif ％}
</body>
</html>