Django框架简单搭建增删改查页面 Django请求生命周期流程图
目录
Django框架简单搭建增删改查页面
一、前期的配置文件以及连接MySQL的基本准备
二、在数据库中准备好数据
三、将MySQL的数据展示到页面（简单认识HTML模板语法 for循环）
- 在Django项目views.py文件中利用ORM模型语法查找所有的数据
def user_list(request):
# 1.获取user表中所有的数据展示到html页面上
user_data = models.UserInfo.objects.filter() # 括号内不填筛选条件等价于查所有
# QuerySet[对象1，对象2] 列表套对象
# 2.利用模版语法传递数据到html页面并完成处理最终返回给浏览器展示
return render(request,'user_list.html',{'user_data':user_data})
四、创建用户数据展示HTML页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
{# <link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.css">#}
{# <script src="bootstrap-3.4.1-dist/js/bootstrap.js"></script>#}
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
</head>
<body>
<div class="container">
<div class="row">
<h1 class="text-center">数据展示页</h1>
<div class="col-md-8 col-md-offset-2">
<table class="table table-hover table-striped">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Password</th>
<th>Age</th>
<th class="text-center">Operation</th>
</tr>
</thead>
<tbody>
{% for user_obj in user_data %} # 接收Django提供的模板语法传过来的字典数据
<tr>
<td>{{ user_obj.id }}</td>
<td>{{ user_obj.name }}</td>
<td>{{ user_obj.password }}</td>
<td>{{ user_obj.age }}</td>
<td class="text-center">
<a href="" class="btn btn-primary btn-xs">编辑</a>
<a href="" class="btn btn-danger btn-xs">删除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
<a href="/user_login/" class="btn btn-block btn-success">登录用户</a>
<a href="/user_register/" class="btn btn-block btn-danger">注册用户</a>
</div>
</div>
</div>
</body>
</html>
五、在urls.py路由层中加入视图函数的路径，后面都是如此
六、在浏览器地址栏输入http://127.0.0.1:8010/user_list查看数据展示页面
增----注册功能
- 首先在views.py中写好一个简单的注册视图函数,记得写好后去路由层写一下功能路径
def user_register(request):
#2.根据不同的请求方式做不同的处理
if request.method == 'POST':
# 3.获取用户相关数据
username_data = request.POST.get('name') # name age password是前端表单中name属性定义的
age_data = request.POST.get('age') # 这里的数据是前端页面用户数据的数据
password_data = request.POST.get('password')
# 继续一些小的判断
if len(username_data) == 0 or len(password_data) == 0:
return HttpResponse("用户名或年龄不能为空")
user_data = models.UserInfo.objects.filter(name=username_data) # 用户输入的username拿去和数据库中已经存在的用户比较
if user_data:
return HttpResponse('用户名已经存在') # 不存在将用模型语法创建一个新用户数据
models.UserInfo.objects.create(name=username_data,age=age_data,password=password_data)
# 重定向到数据展示页
return redirect('/user_list/')
# 1.先返回一个获取注册新用户数据的html页面
return render(request, 'register.html')
- 然后写一个注册用户的HTML页面,注意修改表单的请求方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
{# <link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.css">#}
{# <script src="bootstrap-3.4.1-dist/js/bootstrap.js"></script>#}
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
</head>
<body>
<div class="container">
<div class="row">
<h1 class="text-center">注册用户</h1>
<div class="col-md-6 col-md-offset-3">
<form action="" method="POST">
<p>用户名:
<input type="text" name="name" class="form-control">
</p>
<p>年龄:
<input type="text" name="age" class="form-control">
</p>
<p>密码:
<input type="text" name="password" class="form-control">
</p>
<input type="submit" value="注册" class="btn btn-warning btn-block">
</form>
</div>
</div>
</div>
</body>
</html>
- 然后去浏览器地址栏输入http://127.0.0.1:8010/register，就可以得到以下页面，当然在数据展示页面点击注册也可以跳到当页面
- 在输入框输入新用户，则会看到新用户增加
ps:注意这里的a是get请求
查----登录功能
- 首先在views.py中写好一个简单的登录视图函数,记得写好后去路由层写一下路径
def user_login(request):
# 2.根据不同的请求方式做不同的处理
if request.method == 'POST':
# 3.获取用户相关数据
username_data = request.POST.get('name') # 这里传的是input中name的值
age_data = request.POST.get('age')
password_data = request.POST.get('password')
# 继续一些小的判断
if len(username_data) == 0 or len(password_data) == 0:
return HttpResponse("用户名或年龄不能为空")
user_data = models.UserInfo.objects.filter(name=username_data,password=password_data) # 这里是拿出数据库的值（等号前面）和浏览器的值比较
if user_data:
return HttpResponse('登录成功')
return HttpResponse('该用户不存在')
# models.UserInfo.objects.create(name=username_data, age=age_data, password=password_data)
# 重定向到数据展示页
# return redirect('/user_list/')
# 1.先返回一个获取注册新用户数据的html页面
return render(request, 'login.html')
- 然后写一个登录用户的HTML页面,注意修改表单的请求方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
{# <link rel="stylesheet" href="bootstrap-3.4.1-dist/css/bootstrap.css">#}
{# <script src="bootstrap-3.4.1-dist/js/bootstrap.js"></script>#}
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
</head>
<body>
<div class="container">
<div class="row">
<h1 class="text-center">登录用户</h1>
<div class="col-md-6 col-md-offset-3">
<form action="" >
<p>用户名:
<input type="text" name="name" class="form-control">
</p>
<p>密码:
<input type="text" name="password" class="form-control">
</p>
<input type="submit" value="登录" class="btn btn-danger btn-block">
</form>
</div>
</div>
</div>
</body>
</html>
然后去浏览器地址栏输入http://127.0.0.1:8010/login，就可以得到以下页面，当然在数据展示页面点击登录也可以跳到当页面
在输入框输入存在的用户名和密码，则会看到页面会返回到HttpResponse结果
改----编辑功能 （稍微复杂一丢丢）
- 首先在views.py中写好一个简单的编辑视图函数,记得写好后去路由层写一下功能路径
def user_edit_func(request):
# 1.获取用户想要编辑的数据主键值
target_edit_id = request.GET.get('edit_id')
# 4.根据不同的请求处理不同的逻辑
if request.method == 'POST':
name_data = request.POST.get('name')
age_data = request.POST.get('age')
if len(name_data) == 0 or len(age_data) == 0:
return HttpResponse('用户名或年龄不能为空')
models.User.objects.filter(pk=target_edit_id).update(name=name_data, age=age_data)
# 5.重定向到数据展示页
return redirect('/user_list/')
# 2.根据主键值获取对应的数据
target_edit_obj = models.User.objects.filter(pk=target_edit_id)[0] # QuerySet [对象1,对象2,...]
# 3.返回一个编辑数据的页面 并且该页面上需要提前展示出原来的数据
return render(request, 'userEditPage.html', {'target_edit_obj': target_edit_obj})
- 然后写一个编辑用户的HTML页面,注意修改表单的请求方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
</head>
<body>
<div class="container">
<div class="row">
<h1 class="text-center">数据编辑页</h1>
<div class="col-md-6 col-md-offset-3">
<form action="" method="post">
<p>name:
<input type="text" name="name" class="form-control" value="{{ target_edit_obj.name }}">
</p>
<p>age:
<input type="text" name="password" class="form-control" value="{{ target_edit_obj.password }}">
</p>
<input type="submit" value="编辑用户" class="btn btn-primary btn-block">
</form>
</div>
</div>
</div>
</body>
</html>
ps:这里需要注意的两个点，也是我第一次写的时候，由于逻辑没有理清，少写了edit_id参数在user_list.html文件中需要用get请求传的参数，所以出现了IndexError: list index out of range错误
- 解决方法
这里注意传点击的id参数 - 在浏览器地址栏搜索编辑页面的时候，不能直接http://127.0.0.1:8010/user_edit/因为没有id，拿不到一个对象，所以列表为空，索引超出了范围
- 只需要在地址栏输入http://127.0.0.1:8010/user_edit/?edit_id=2即可，展示页面如下
删----删除功能 （复习前端js的冒泡事件）
- 首先在views.py中写好一个简单的编辑视图函数,记得写好后去路由层写一下功能路径
def user_delete(request):
target_delete_id = request.GET.get('delete_id')
models.UserInfo.objects.filter(pk=target_delete_id).delete()
return redirect('user_list')
- 然后去user_list.html页面修改一下删除按钮a便签的href属性,注意修改表单的请求方式，给该便签绑定一个点击事件
<td class="text-center">
<a href="/user_edit/?edit_id={{ user_obj.pk }}" class="btn btn-primary btn-xs">编辑</a>
<a href="/user_delete/?delete_id={{ user_obj.pk }}" class="btn btn-danger btn-xs delBtn">删除</a>
</td>
ps: 二次确认冒泡事件
<script>
$('.delBtn').click(function () {
let res = confirm('你确定要删除嘛？')
if (res){
{# 如果点击确定 则执行事件冒泡 #}
}else{
return false {# 如果点击取消 则阻止事件冒泡 #}
}
})
</script>
Django请求生命周期流程图
1.Django请求的生命周期的含义
- Django请求生命周期是指：当用户在浏览器上输入URL到用户看到网页的这个时间段内，Django后台所发生的事情。
2.Django请求的生命周期图解及流程
浏览器
发送请求(HTTP协议)
web服务网关接口
1.请求来的时候解析封装
响应走的时候打包处理
2.django默认的wsgiref模块不能承受高并发 最大只有1000左右
上线之后会替换成uwsgi来增加并发量
3.WSGI跟wsgiref和uwsgi是什么关系
WSGI是协议
wsgiref和uwsgi是实现该协议的功能模块
django后端
1.django中间件
类似于django的保安 门户
2.urls.py 路由层
识别路由匹配对应的视图函数
3.views.py 视图层
网站整体的业务逻辑
4.templates文件夹 模版层
网站所有的html文件
5.models.py 模型层
ORM
Django框架简单搭建增删改查页面 Django请求生命周期流程图的更多相关文章
- 基于Django框架 CRM的增删改查
思路: 创建表------从数据库读出数据展示出来------配置路由-----写视图函数------写对应页面 练习点: 数据库建表 ORM 数据库数据读取 数据 ModelForm (form组 ...
- Django学习笔记（10）——Book单表的增删改查页面
一,项目题目:Book单表的增删改查页面 该项目主要练习使用Django开发一个Book单表的增删改查页面,通过这个项目巩固自己这段时间学习Django知识. 二,项目需求: 开发一个简单的Book增 ...
- BitAdminCore框架应用篇：（二）创建一个简单的增删改查模块
NET Core应用框架之BitAdminCore框架应用篇系列 框架演示:http://bit.bitdao.cn 框架源码:https://github.com/chenyinxin/cookie ...
- [Django框架 - 静态文件配置、request对象方法初识、 pycharm链接数据库、ORM实操增删改查、django请求生命周期]
[Django框架 - 静态文件配置.request对象方法初识. pycharm链接数据库.ORM实操增删改查.django请求生命周期] 我们将html文件默认都放在templates文件夹下 将 ...
- 通过flask实现web页面简单的增删改查bootstrap美化版
通过flask实现web页面简单的增删改查bootstrap美化版 项目目录结构 [root@node1 python]# tree -L 2 . ├── animate.css ├── fileut ...
- 通过flask实现web页面简单的增删改查
通过flask实现web页面简单的增删改查 # 1.后台程序falsk_web01.py #coding:utf-8 from flask import Flask,render_template,r ...
- springmvc+spring3+hibernate4框架简单整合,简单实现增删改查功能
转自:https://blog.csdn.net/thinkingcao/article/details/52472252 C 所用到的jar包 数据库表 数据库表就不用教大家了,一张表,很简 ...
- 【转载】salesforce 零基础开发入门学习（六）简单的数据增删改查页面的构建
salesforce 零基础开发入门学习(六)简单的数据增删改查页面的构建 VisualForce封装了很多的标签用来进行页面设计,本篇主要讲述简单的页面增删改查.使用的内容和设计到前台页面使用的 ...
- Django框架（三）—— orm增删改查、Django生命周期
目录 orm增删改查.Django生命周期 一.orm介绍 二.orm增删改字段 三.Django生命周期 orm增删改查.Django生命周期 一.orm介绍 1.什么是orm ORM即Object ...
- 用CI框架向数据库中实现简单的增删改查
以下代码基于CodeIgniter_2.1.3版 用PHP向数据库中实现简单的增删改查(纯代码)请戳 http://www.cnblogs.com/corvoh/p/4641476.html Code ...
随机推荐
- java8 stream按某个字段分组，允许分组字段是null
Map<String, List<Dto>> deviceMap = deviceList.stream().collect(Collectors.groupingBy(Dto ...
- pytorch模块介绍：torch.nn
一.简介 nn全称为neural network,意思是神经网络,是torch中构建神经网络的模块. 二.子模块介绍 2.1 nn.functional 该模块包含构建神经网络需要的函数,包括卷积层. ...
- php 中 session存储
转载网址: https://blog.csdn.net/miliu123456/article/details/107048378/ php 中 session 更换存储方式(file, redis, ...
- pytorch CrossEntropyLoss() 默认转换one-hot编码
import torchpredict = torch.randn((4,3))predict = torch.nn.functional.softmax(predict,dim = 1)target ...
- 痞子衡嵌入式：我为2021 TencentOS Tiny AIoT应用创新大赛做了场直播培训
TencentOS Tiny AIoT 应用创新大赛是腾讯 TencentOS 团队联合恩智浦半导体.安谋科技(Arm China)发起的线上开发者活动,主要面向中小企业嵌入式工程师.广大嵌入式开发者 ...
- 分布式CAP_BASE博客参考
https://blog.csdn.net/lixinkuan328/article/details/95535691 CAP 一致性(Consistency) 可用性(Availability) 分 ...
- 页面录制服务上线：RESTful API 调用实现，所见所录即所得
我们为很多实时互动场景提供了服务.在一些场景中,用户不仅需要实时互动,还需要把互动的过程录下来.那么一个好的录制解决方案究竟需要具备哪些特征呢? 在回答这个问题之前,先聊一下客户使用录制的原因.一般来 ...
- springboot 接入 ChatGPT
项目地址 https://gitee.com/Kindear/lucy-chat 介绍 lucy-chat是接入OpenAI-ChatGPT大模型人工智能的Java解决方案,大模型人工智能的发展是不可 ...
- vue 和 react 的区别有哪些
vue 和 react 有什么区别呢?下面从这 4 个角度来说一说! (1)从编程范式的角度讲 在 vue-loader.vue-template-compiler 的支持下,vue 可以采用 SFC ...
- OpenAI Kubernetes 相关博文读后笔记
一.概述 最近 ChatGPT 和其公司 OpenAI 特别火:ChatGPT 3, ChatGPT 3.5, New Bing, ChatGPT 4... 怀着学习的心态,这几天访问了 OpenAI ...