Djiango实现用户管理增删改成功能实战

已于 2022-12-30 18:06:58 修改
阅读量1.3k 收藏 7
点赞数
分类专栏： python 文章标签： 前端 java mysql
于 2022-12-25 23:30:06 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43546282/article/details/128434620
版权

1.0定义

前后端不分离模式
在这里插入图片描述

前后端分离是指前端页面看到的效果都是由后端控制，即后端渲染HTML页面，前端与后端的耦合度比较高
前后端分离模式
在这里插入图片描述

后端仅返回前端所需要的数据，不在渲染HTML页面，不在控制前端的效果，至于前端展示什么效果，都有前端自己决定。

2.0 认识RestFulAPI

1.0 REST 是一种web服务的软件架构风格，描述网络中客户端与服务端的一种交互方式(REST风格网络接口)
2.0 Restfulapi风格就是把所有的数据当作资源，对表的操作就是对资源的操作
3.0 资源就是指URL，基于url对资源操作，web服务在url上支持一系列请求方法，如下
http方法数据处理说明
POST新增新增一个资源
GET获取获取一个资源
PUT更新更新一个资源
DELETE删除删除一个资源

3.0 通过项目回顾Djiango开发模式

1.熟悉Djiango项目流程创建
2.熟悉Djiango与HTML模版交互
3.熟悉Ajax前后端数据交互
4.熟悉ORM数据交互操作
3.1 创建一个djiango项目

在这里插入图片描述
#创建一个myapp应用

python3  manage.py startapp  myapp
3.2 配置使用mysql数据库

3.2.1 启动一个本地可以连接的mysql数据库

docker run -d --name db  \
--network=host   \
-p 3306:3306 -v  \
mysqldata:/var/lib/mysql  \
-e MYSQL_ROOT_PASSWORD=123456 \
mysql:5.7 --character-set-server=utf8

3.2.2 安装pymysql工具

pip install pymysql

3.2.3 修改settins.py配置文件,注释原来的配置
在这里插入图片描述

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'mydb',
        'USER': 'root',
        'PASSWORD': '123456',
        'HOST': '172.16.226.7',
        'PORT': '3306',
    }
}

3.2.4 修改myapp模块下__init__.py配置文件

import pymysql
pymysql.install_as_MySQLdb()

在这里插入图片描述
在这里插入图片描述
3.2.5 创建数据表，并初始化数据
在这里插入图片描述
在这里插入图片描述

 python3  manage.py makemigrations  #生成初始化表sql
 python3  manage.py migrate         #执行初始化表sql

在这里插入图片描述
说明初始化数据库成功

3.3 写入数据测试验证

3.3.1 编写主路由文件
在这里插入图片描述
3.3.2 编写myapp 视图和路由文件

from  django.http import HttpResponse

def user(request):
    if request.method == "GET":
        return HttpResponse("获取用户")
    elif request.method == "POST":
        return HttpResponse("创建用户")
    elif request.method == "PUT":
        return HttpResponse("更新用户")
    elif request.method == "DELETE":
        return HttpResponse("删除用户")

在这里插入图片描述
在这里插入图片描述

from django.contrib import admin
from django.urls import path,include
from .  import views

urlpatterns = [
    path('user/', views.user),
]

验证
在这里插入图片描述

3.4 展示用户

3.4.1 编写视图

from django.shortcuts import render
# Create your views here.
from  django.http import HttpResponse
from .models import User

def user(request):
    if request.method == "GET":
        user_list = User.objects.all()
        return render(request, 'user_list.html',{'user_list': user_list})
    elif request.method == "POST":
        return HttpResponse("创建用户")
    elif request.method == "PUT":
        return HttpResponse("更新用户")
    elif request.method == "DELETE":
        return HttpResponse("删除用户")

在这里插入图片描述
3.4.2 编写html模版文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列出所有用户</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<button><a href="/myapp/user_add" target="_blank">创建用户</a> </button>
<table border="1">
    <thead>
        <tr>
            <th style="display: none">ID</th>
            <th>姓名</th>
            <th>城市</th>
            <th>性别</th>
            <th>年龄</th>
            <th>操作</th>
        </tr>
    </thead>
    <tbody>
        {% for i in user_list %}
        <tr>
            <td style="display: none">{{ i.id }}</td>
            <td>{{ i.name }}</td>
            <td>{{ i.city }}</td>
            <td>{{ i.sex }}</td>
            <td>{{ i.age }}</td>
            <td>
                <button><a href="/myapp/user_edit?id={{ i.id }}" target="_blank">编辑</a> </button>
                <button id="del" onclick="delUser(this)">删除</button>
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>
<script>
    function  delUser(obj) {
        confirm = confirm('是否删除用户？');
        if (confirm) {
            id = $(obj).parent().parent().find("td:eq(0)").text();
            //获取button父元素td，再获取td父元素tr，最后获取tr第一个值
            console.log(id)
            data ={'id':id};
            $.ajax({
                type: 'DELETE',
                url: '/myapp/user/',
                data: data,
                success: function (result) {
                    if(result.code === 200){
                        alert(result.msg);
                        location.reload();
                    } else {
                        alert(result.msg)
                    }
                }


            })

        }
    }
</script>
</body>
</html>

在这里插入图片描述
最终实现效果如图

3.5 实现新增用户功能

3.5.1 新增路由

 urlpatterns = [
    path('user/', views.user),
    path('user_add/', views.user_add)
]

3.5.2 新增视图
在这里插入图片描述


def  user_add(request):
    return render(request, 'user_add.html')

def user(request):
    if request.method == "GET":
        user_list = User.objects.all()
        return render(request, 'user_list.html',{'user_list': user_list})
    elif request.method == "POST":
        name = request.POST.get('name')
        city = request.POST.get('city')
        sex = request.POST.get('sex')
        age = request.POST.get('age')
        User.objects.create(
            name=name,
            city=city,
            sex=sex,
            age=age
        )
        return HttpResponse("创建用户成功！")
    elif request.method == "PUT":
        return HttpResponse("更新用户")
    elif request.method == "DELETE":
        return HttpResponse("删除用户")

3.5.3 新增html模版

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>创建用户</title>
</head>
<body>
<form action="/myapp/user/" method="post">
    姓名： <input type="text" name="name"><br>
    城市： <input type="text" name="city"><br>
    性别： <input type="text" name="sex"><br>
    年龄： <input type="text" name="age"><br>
    <input type="submit" value="提交">
</form>
</body>
</html>

在这里插入图片描述
3.5.4 验证
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

3.6删除用户功能

3.6.1 编写视图

from django.shortcuts import render
from  django.http import HttpResponse,QueryDict,JsonResponse
from .models import User

def  user_add(request):
    return render(request, 'user_add.html')

def user(request):
    if request.method == "GET":
        user_list = User.objects.all()
        return render(request, 'user_list.html',{'user_list': user_list})
    elif request.method == "POST":
        name = request.POST.get('name')
        city = request.POST.get('city')
        sex = request.POST.get('sex')
        age = request.POST.get('age')
        User.objects.create(
            name=name,
            city=city,
            sex=sex,
            age=age
        )
        return HttpResponse("创建用户成功！")
    elif request.method == "PUT":
        return HttpResponse("更新用户")
    elif request.method == "DELETE":
        data = QueryDict(request.body) #封装删除函数
        id = data.get('id')
        try:
            User.objects.get(id=id).delete()
            res = {'code': 200, 'msg': '删除用户成功！'}
        except Exception:
            res = {'code': 500, 'msg': '删除用户失败！'}
        return JsonResponse(res)

在这里插入图片描述
3.6.2 编写 html模版

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列出所有用户</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<button><a href="/myapp/user_add" target="_blank">创建用户</a> </button>
<table border="1">
    <thead>
        <tr>
            <th>ID</th>
            <th>姓名</th>
            <th>城市</th>
            <th>性别</th>
            <th>年龄</th>
            <th>操作</th>
        </tr>
    </thead>
    <tbody>
        {% for i in user_list %}
        <tr>
            <td>{{ i.id }}</td>
            <td>{{ i.name }}</td>
            <td>{{ i.city }}</td>
            <td>{{ i.sex }}</td>
            <td>{{ i.age }}</td>
            <td>
                <button>编辑</button>
                <button id="del" onclick="delUser(this)">删除</button>
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>
<script>
    function  delUser(obj) {
        confirm = confirm('是否删除用户？');
        if (confirm) {
            id = $(obj).parent().parent().find("td:eq(0)").text();
            //获取button父元素td，再获取td父元素tr，最后获取tr第一个值
            console.log(id)
            data ={'id':id};
            $.ajax({
                type: 'DELETE',
                url: '/myapp/user/',
                data: data,
                success: function (result) {
                    if(result.code === 200){
                        alert(result.msg);
                        location.reload();
                    } else {
                        alert(result.msg)
                    }
                }
            })
        }
    }
</script>
</body>
</html>

在这里插入图片描述
新增如图所示部分
3.6.3 展示效果
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
删除完会自动刷新，删除功能实现完成

3.7实现编辑功能

3.7.1 新增html模版(user_edit.html)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>编辑用户</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<h2>编辑用户</h2>
<form action="#">
    <input type="text" name="id" value="{{ user.id }}" style="display: none">
    姓名： <input type="text" name="name" value="{{ user.name }}"><br>
    城市： <input type="text" name="city" value="{{ user.city }}"><br>
    性别： <input type="text" name="sex"  value="{{ user.sex }}"><br>
    年龄： <input type="text" name="age"  value="{{ user.age }}"><br>
    <input type="button" value="提交" id="btn">
</form>
<script>
    //通过id向后端api请求获取用户数据【get】
    //点击提交，获取输入的值发给后端【put】
    $('#btn').click(function (){
        var id = $('input[name=id]').val();
        var name = $('input[name=name]').val();
        var city = $('input[name=city]').val();
        var sex = $('input[name=sex]').val();
        var age = $('input[name=age]').val();
        var data = {'id':id,'name':name,'city':city,'sex':sex,'age':age}
            $.ajax({
                type: 'PUT',
                url: '/myapp/user/',
                data: data,
                success: function (result) {
                    if(result.code == 200) {
                        alert('更新用户成功');
                    } else {
                        alert('更新用户失败')
                    }
                },
                error: function (){
                    alert('服务器接口异常！')
                }

    })
    })

</script>
</body>
</html>

3.7.2 新增路由（urls.py）
user_edit

from django.contrib import admin
from django.urls import path,include
from .  import views

urlpatterns = [
    path('user/', views.user),
    path('user_add/', views.user_add),
    path('user_edit/', views.user_edit),
]

3.7.3 新增视图函数

from django.shortcuts import render
from  django.http import HttpResponse,QueryDict,JsonResponse
from .models import User
#创建用户
def  user_add(request):
    return render(request, 'user_add.html')
#编辑用户
def user_edit(request):
    id = request.GET.get('id')
    user_obj = User.objects.get(id=id)
    return render(request, 'user_edit.html',{'user':user_obj})

#查看用户
def user(request):
    if request.method == "GET":
        user_list = User.objects.all()
        return render(request, 'user_list.html',{'user_list': user_list})
    elif request.method == "POST":
        name = request.POST.get('name')
        city = request.POST.get('city')
        sex = request.POST.get('sex')
        age = request.POST.get('age')
        User.objects.create(
            name=name,
            city=city,
            sex=sex,
            age=age
        )
        return HttpResponse("创建用户成功！")
    elif request.method == "PUT":
        data = QueryDict(request.body)  # 封装删除函数
        id = data.get('id')
        #用户更新
        user_obj =User.objects.get(id=id)
        user_obj.name = data.get('name')
        user_obj.city = data.get('city')
        user_obj.sex = data.get('sex')
        user_obj.age = data.get('age')
        user_obj.save()#保存数据
        result = {'code': 200, 'msg': '更新用户成功！！！'}
        return JsonResponse(result)

    elif request.method == "DELETE":
        #根据用户id删除记录
        data = QueryDict(request.body) #封装删除函数
        id = data.get('id')
        try:
            User.objects.get(id=id).delete()
            res = {'code': 200, 'msg': '删除用户成功！'}
        except Exception:
            res = {'code': 500, 'msg': '删除用户失败！'}
        return JsonResponse(res)

3.7.4 编辑按钮跳转
#设置超链接，打开新窗口

<button><a href="/myapp/user_edit?id={{ i.id }}" target="_blank">编辑</a> </button>

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

3.8 函数视图转化成类视图

3.8.1 修改路由
在这里插入图片描述
3.8.2 修改视图转换类（get/post/pull/delete）

class UserView(View):
    def get(self,request):
        return HttpResponse('获取用户')
    def post(self,request):
        name = request.POST.get('name')
        city = request.POST.get('city')
        sex = request.POST.get('sex')
        age = request.POST.get('age')
        User.objects.create(
            name=name,
            city=city,
            sex=sex,
            age=age
        )
        return HttpResponse("创建用户成功！")
        return JsonResponse(result)
    def put(self, request):
        data = QueryDict(request.body)  # 封装修改用户函数
        id = data.get('id')
        # 用户更新
        user_obj = User.objects.get(id=id)
        user_obj.name = data.get('name')
        user_obj.city = data.get('city')
        user_obj.sex = data.get('sex')
        user_obj.age = data.get('age')
        user_obj.save()  # 保存数据
        result = {'code': 200, 'msg': '更新用户成功！！！'}
        return JsonResponse(result)
    def delete(self,request):
        # 根据用户id删除记录
        data = QueryDict(request.body)  # 封装删除函数
        id = data.get('id')
        User.objects.get(id=id).delete()
        result = {'code': 200, 'msg': '删除用户成功！'}
        return JsonResponse(result)
运维-大白同学
关注
专栏目录
Django入门项目实战
qq_57297291的博客
06-21 827
程序员初级
Django之日志的配置使用
yunlibiqing的博客
11-03 386
setting.py中 LOGGING = { 'version': 1, 'disable_existing_loggers': False, # 是否禁用已经存在的日志器 'formatters': { # 日志信息显示的格式 'verbose': { 'format': '%(levelname)s %(asctime)s ...
Django的项目结构与配置解析 —— Python篇
最新发布
小蜜蜂vs码农
08-20 773
Django的项目结构与配置解析 —— Python篇
06-Django项目实战
apple_52651630的博客
08-04 574
模块功能验证图形验证、短信验证用户注册、登录、用户中心（基本信息、邮箱激活、收货地址、我的订单、修改密码）第三方登录QQ登录首页广告首页广告商品商品列表、商品搜索、商品详情、商品浏览记录购物车购物车管理、购物车合并订单确认订单、提交订单、订单商品评价支付支付宝支付1.新建MySQL数据库：name2.新建MySQL用户3.授权poppies用户访问name数据库4.授权结束后刷新特权。
Django的使用
W-Y-Z的博客
05-25 1105
Django的使用 1. 进行安装 按Windows + R 弹出运行框输入cmd打开命令行 输入：pip install django 如果需要指定版本：pip install django==版本号 如果不指定，默认安装最新的 pip install djangorestframework 2. 创建项目 在命令行中输入： django-admin startproject 项目名字 django-admin startproject newproject settings 是配置文件
pycharm 下的djiango使用
02-11 435
创建工程可以在虚拟环境下运行，创建工程后使用命令 在python 下的命令窗口（Terminal） python3 manage.py startapp django_web （或者 python3替换为 python） 在 setting里面注册你刚启动的工程 Django的开发遵循MTV模式（models, templates, views），views.py...
【django学习】——Django介绍和实战（开发简易版博客网页）
m0_67266585的博客
06-18 2754
目录0、视频链接?1、环境配置?2、django基本命令1）常见命令?2）数据库相关的Django命令?3、Django项目1）Django创建项目?2）项目目录介绍3）运行初始化的Django项目?4、Django应用1）Django项目和Django应用?2）Django应用目录（1）创建Django应用（2）应用目录各文件介绍?问题1：视图、路由、模型是什么意思？5、Django视图&Django路由（what、why、how）1）Django视图（view.py）——创建逻辑函数（数据处理）?2）D
django项目开发实战——博客
热门推荐
一只路过的小码农cxy
08-08 4万+
p个大s： 这里用的是python3.7和Django2.0.假设全都安装成功= = 然后这个是我做个人网站的一个过程=。= 然后这个也不能算是个教程吧=。= 然后这只是粗糙的记录=。= 最后，防脱发用霸王=3= 生成一个完整的django项目 创建Django项目 django-admin.py startproject MySite 此时，你会看到这样的文件夹： 运行一下...
Django实战专题: 专业博客开发(1)之内容管理后台开发
大江狗
09-14 2699
很多人学习Django都是从开发个人博客入手的，网上的教程也很多，但后台大多是基于Django自带的admin来实现文章的增删查改，而前台也只是实现了简单地展示文章列表和某篇文章详情。开发一个专业的博客显然不止是那么简单的，小编我今天就带你利用Django开发一个专业点的博客，重点放在开发内容管理后台。我会带你分析每一步的代码思路，帮你了解一个优秀的程序员应该如何思考，并解决遇到的技术问题。本文适...
Django实战: 手把手教你配置Django SimpleUI打造美丽后台(多图)
大江狗
05-13 2万+
很多人对Django自带的管理后台admin是又爱又恨，优点是几行代码配置就可以撸出一个功能性强的管理后台，缺点就是不怎么美观，感觉拿不出手。在所有的Django后台美化插件中，Simpl...
Django的简单使用
weixin_45523960的博客
06-22 411
Django的简单使用
Django项目
06-19
天天生鲜前端页面包括html5 css js ,django后端代码，很适合刚开始学习django的朋友使用
django-删除学生数据
pyhui的技术博客
08-09 1101
目标： 删除学生的数据 删除后更新显示学生列表 分析 要删除，肯定是要点击一个东西 按钮？ 超链接？ 简单的来，按 照超链接来 超链接–》网址==》视图函数 只需要让视图函数帮我们完成删除操做就好了 视图函数 在列表页弄上删除入口 完成路由及视图函数的布局 视图函数的核心 就是一个sql语句 post传参的情景 1,form表单 2, ajax请求 get传参的格式 通过ULR进行GET传参 ...
django项目
weixin_46769840的博客
08-26 1462
自学django项目时的笔记
Djiango入门(一) 持续更新
qq_41383176的博客
08-26 2148
使用工具pycharm,python版本3.7 1.创建项目 2.创建应用 python mamnage.py startapp booktest 创建一个叫booktest的应用,应用可以创建多个 打开应用结构目录 1…admin.py：Django自带了一个管理界面启动就能看到 2…init.py：表明polls也是一个包 3.migrations：用来初始化数据库，在执行python ...
Django学习2-用户管理系统（简单部门管理、用户管理）
weixin_48137421的博客
05-17 3383
通过一个简单的案例，对所学知识 进行回顾，创建项目—创建app—创建数据库—数据库和前端界面的交互....
linux发布djiango项目（域名申请与阿里云服务器介绍）
weixin_45741535的博客
11-26 260
域名申请和阿里云服务器介绍 域名：就是方便记忆的网址 www开关的是一级域名 需要购买！ 只有1个（www.xxxx.cn） 不以www开头的是二级域名或子域名 1 个一级域名可包含N个子域名 # 一级/主域名 www.zhouzhengyang.cn # 子 api.zhouzhengyang.cn #接口 m.zhouzhengyang.cn #手机版 music.zhouzhengyang.cmn # 音乐 tieba.zhouzhengyang.cmn # 社区中心 ..
十四、Django框架使用
mChenys的博客
10-19 984
Django是劳伦斯出版集团的开发人员为开发新闻内容网站而设计出来的一个软件，它遵循MVC思想，但是有自己的一个名词，叫做MVT。Django遵循快速开发和DRY原则。Do not repeat yourself.不要自己去重复一些工作。它提供了许多有用的工具和功能，使开发者能够轻松地构建高度可拓展、安全、高性能的 Web 应用。强大的路由系统：Django 提供了易于配置和管理 URL 路由的功能，使开发者能够定义页面和应用程序的 URL 映射。
Django学习1——安装、创建项目、数据库、用户管理案例
weixin_48137421的博客
05-09 7547
Django学习2——安装、创建项目、数据库、用户管理案例
Django图书管理系统：入门与增删改查实战
本篇文章主要介绍了如何基于Django框架构建一个简单的图书管理系统，该系统是在第47讲的2022年B站详细Django 3教程中讲解的实战案例。以下是文章的主要知识点： 1. **创建项目与app**: 首先，创建一个新的Django...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值