51.Python-web框架-Django开始第一个应用的增删改查

devtools/2024/11/13 9:22:08/

目录

1.概述

2.创建应用

创建app01

在settings.py里引用app01

3.定义模型

 在app01\models.py里创建模型

数据库迁移

4.创建视图

引用头

部门列表视图

部门添加视图

部门编辑视图

部门删除视图

5.创建Template

在app01下创建目录templates

部门列表模板depart.html

 源代码

{% for depart in departs %}

确认删除的代码

删除按钮

确认框Modal

删除按钮的js代码

分页

外观

部门新增模板depart_add.html

 源代码

 外观

部门编辑模板depart_edit.html

 源代码

外观

6.URL配置


1.概述

        在Django中创建一个简单的应用app01,以部门管理为例,演示了部门的增删改查(CRUD)功能,可以按照以下步骤进行:

  1. 创建应用
  2. 定义模型
  3. 数据库迁移
  4. 创建视图
  5. 创建Template
  6. URL配置

2.创建应用

创建app01

python manage.py startapp app01

创建成功后,有下面的目录,templates是手动创建。 

在settings.py里引用app01

3.定义模型

 在app01\models.py里创建模型

这里可以创建任意多个模型。

from django.db import models# Create your models here.class Department(models.Model):name = models.CharField(verbose_name='部门名称', max_length=200,)description = models.TextField(verbose_name='部门描述', blank=True, null=True)parent = models.IntegerField(verbose_name='父部门', blank=True, null=True, default=0)is_active = models.BooleanField(verbose_name='是否启用', default=True)is_locked = models.BooleanField(verbose_name='是否锁定', default=False)is_deleted = models.BooleanField(verbose_name='是否删除', default=False)created_by = models.CharField(verbose_name='创建人', max_length=200, blank=True, null=True)updated_by = models.CharField(verbose_name='更新人', max_length=200, blank=True, null=True)created_at = models.DateTimeField(verbose_name='创建时间',auto_now=True)updated_at = models.DateTimeField(verbose_name='更新时间',auto_now=True)
  •  models.CharField是字段类型,大家基本上能看懂。
  • verbose_name 是Django模型字段和模型类的一个属性,用于提供一个人类可读的字段或模型名称。这在Django的管理界面和表单中尤其有用,可以使得字段或模型的显示更加友好和直观。
  • max_length是CharField字段类型必须,指定长度。

 其它的属性查看django文档基本都能找到说明。

数据库迁移

还是那两个命令

python manage.py makemigrationspython manage.py migrate

4.创建视图

        这里写了部门增删改查的方法,并没有做项目上那种严谨的逻辑判断,例如,新增部门时,都没有判断部门名称是否为空等,这些常规的操作,自己去做吧。

引用头

from django.shortcuts import render, redirect
from app01 import models
from django.utils import timezone
from django.http import JsonResponse
# Create your views here.

部门列表视图

        models.Department.objects.all()下面有很多方法可以使用,用起来还挺方便。具体项目上,可能有更复杂的需求,未必能否满足。

       queryset[obj,obj,obj] =  models.Department.objects.all().order_by('id') 

        queryset[obj,obj,obj]  = models.Department.objects.all().filter(id=0) 

        object = models.Department.objects.all().filter(id=0) .first()

       注意查询方法的返回结果的类型,这很重要。前台在template里会用到。

        django还支持自己写sql去查询,具体请看教程:

43.django里写自定义的sql进行查询-CSDN博客
 

def depart(request):departs = models.Department.objects.all().order_by('id')# print(departs)# return HttpResponse('部门管理')return render(request, 'depart.html' , {'departs' : departs })

部门添加视图

def depart_add(request):if request.method == 'GET':departs = models.Department.objects.all().filter(parent=0)return render(request, 'depart_add.html', {'departs' : departs })elif request.method == 'POST':name = request.POST.get('name')desc = request.POST.get('description')parent = request.POST.get('parent')user = request.useris_active = request.POST.get('is_active')if is_active == 'on':is_active = Trueelse:is_active = Falseis_locked = request.POST.get('is_locked')if is_locked is not None and is_locked == 'on':is_locked = Trueelse:is_locked = Falsemodels.Department.objects.create(name=name, description=desc, parent=parent,  is_active=is_active, is_locked=is_locked,created_by=user.username, updated_by=user.username)return redirect('/depart/')

部门编辑视图

def depart_edit(request):if request.method == 'GET':id = request.GET.get('id')depart = models.Department.objects.all().filter(id=id).first()print(depart.parent)if depart.parent == 0:departs = Noneelse:departs = models.Department.objects.all().filter(parent=0)return render(request, 'depart_edit.html', {'depart' : depart ,'departs' : departs })elif request.method == 'POST':id = request.POST.get('id')name = request.POST.get('name')desc = request.POST.get('description')parent = request.POST.get('parent')is_active = request.POST.get('is_active')if is_active == 'on':is_active = Trueelse:is_active = Falseis_locked = request.POST.get('is_locked')if is_locked is not None and is_locked == 'on':is_locked = Trueelse:is_locked = Falseuser = request.usernow = timezone.now()models.Department.objects.filter(id=id).update(name=name, description=desc, parent=parent, is_active=is_active, is_locked=is_locked, created_by=user.username, updated_by=user.username, updated_at=now)return redirect('/depart/')

部门删除视图

def depart_del(request):if request.method == 'POST':id = request.POST.get('id')try:models.Department.objects.filter(id=id).delete()        #物理删除,也可以自己做逻辑删除return JsonResponse({'success': True})except:return JsonResponse({'success': False, 'error': 'Object not found'})

5.创建Template

在app01下创建目录templates

部门列表模板depart.html

 源代码

<!DOCTYPE html>
{% load static %}
<html lang="en">
<head><meta charset="UTF-8"><title>部门管理</title><link rel="stylesheet" href="{% static 'bootstrap5/css/bootstrap.min.css' %}"><script src="{% static 'bootstrap5/js/bootstrap.bundle.min.js' %}"></script><script src="{% static 'jquery-3.7.1.min.js' %}"></script>
</head>
<body>
<div class="container"><div style="margin: 10px 0"><a href="../depart/add/" class="btn btn-primary">添加部门</a></div><table class="table table-striped  table-hover "><thead><tr><th scope="col">#</th><th scope="col">部门名称</th><th scope="col">部门描述</th><th scope="col">父部门</th><th scope="col">是否启用</th><th scope="col">是否锁定</th><th scope="col">创建人</th><th scope="col">创建时间</th><th scope="col">更新人</th><th scope="col">更新时间</th><th scope="col">操作</th></tr></thead><tbody>{% for depart in departs %}<tr><td scope="row">{{ depart.id }}</td><td>{{ depart.name }}</td><td>{{ depart.description }}</td><td>{{ depart.parent }}</td><td>{{ depart.is_active }}</td><td>{{ depart.is_locked }}</td><td>{{ depart.created_by }}</td><td>{{ depart.created_at }}</td><td>{{ depart.updated_by }}</td><td>{{ depart.updated_at }}</td><td><a href="../depart/edit/?id={{depart.id}}" class="btn btn-primary btn-sm">编辑</a><button id="deleteBtn" type="button"  class="btn btn-danger btn-sm  delete-btn"  data-id="{{ depart.id }}">删除</button ></td></tr>{% endfor %}</tbody></table><!-- 确认删除的模态框 -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="exampleModalLabel">确认删除</h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body">确定要删除这条记录吗?</div><div class="modal-footer"><button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button><form id="deleteForm" method="post">{% csrf_token %}<input type="hidden" name="id" id="object_id"><button type="submit" class="btn btn-danger">确定删除</button></form></div></div></div>
</div><nav aria-label="Page navigation example"><ul class="pagination"><li class="page-item"><a class="page-link" href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li><li class="page-item"><a class="page-link" href="#">1</a></li><li class="page-item active" ><a class="page-link" href="#">2</a></li><li class="page-item"><a class="page-link" href="#">3</a></li><li class="page-item"><a class="page-link" href="#" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li></ul>
</nav>
</div>
</body>
<script>document.querySelectorAll('.delete-btn').forEach(button => {button.addEventListener('click', function() {const objectId = this.getAttribute('data-id');// 设置隐藏输入框的值document.getElementById('object_id').value = objectId;// 显示模态框$('#deleteModal').modal('show');});});// 提交删除表单时,使用Ajax发送请求$('#deleteForm').on('submit', function(event) {event.preventDefault(); // 阻止表单默认提交行为const formData = $(this).serialize(); // 序列化表单数据$.ajax({type: 'POST',url: '/depart/delete/', // 替换为你的删除视图URLdata: formData,success: function(response) {if (response.success) {// alert('删除成功!');location.reload(); // 刷新页面} else {alert('删除失败,请重试!');}},error: function(xhr, status, error) {console.error(error);alert('发生错误,请检查控制台日志。');}});});
</script>
</html>
{% for depart in departs %}

        在Django模板语言中,{% for ... in ... %} 是一个循环标签,用于迭代一个集合(如列表、元组或字典等)。你提供的代码片段 {% for depart in departs %} 意味着将对名为 departs 的集合进行遍历,其中每个元素临时赋值给 depart 变量,在循环体内可以访问这个变量来进行操作或展示数据。 

确认删除的代码

        确认删除使用了Bootstrap Modal(模态框),是一种覆盖在当前页面上的对话框,用于显示信息、警告、确认对话或复杂的交互形式,而不需要离开当前页面或重新加载页面。

删除按钮
<button id="deleteBtn" type="button"  class="btn btn-danger btn-sm  delete-btn"  data-id="{{ depart.id }}">删除</button ></td>
确认框Modal
    <!-- 确认删除的模态框 -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="exampleModalLabel">确认删除</h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body">确定要删除这条记录吗?</div><div class="modal-footer"><button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button><form id="deleteForm" method="post">{% csrf_token %}<input type="hidden" name="id" id="object_id"><button type="submit" class="btn btn-danger">确定删除</button></form></div></div></div>
</div>
删除按钮的js代码
<script>document.querySelectorAll('.delete-btn').forEach(button => {button.addEventListener('click', function() {const objectId = this.getAttribute('data-id');// 设置隐藏输入框的值document.getElementById('object_id').value = objectId;// 显示模态框$('#deleteModal').modal('show');});});// 提交删除表单时,使用Ajax发送请求$('#deleteForm').on('submit', function(event) {event.preventDefault(); // 阻止表单默认提交行为const formData = $(this).serialize(); // 序列化表单数据$.ajax({type: 'POST',url: '/depart/delete/', // 替换为你的删除视图URLdata: formData,success: function(response) {if (response.success) {// alert('删除成功!');location.reload(); // 刷新页面} else {alert('删除失败,请重试!');}},error: function(xhr, status, error) {console.error(error);alert('发生错误,请检查控制台日志。');}});});
</script>
分页

        这里只写了前台的分页控件放在这里,后台并没有写相应的逻辑。

外观

部门新增模板depart_add.html

 源代码

<!DOCTYPE html>
{% load static %}
<html lang="en">
<head><meta charset="UTF-8"><title>部门管理</title><link rel="stylesheet" href="{% static 'bootstrap5/css/bootstrap.min.css' %}">
</head>
<body><div class="container"><nav aria-label="breadcrumb" style="margin: 10px 0"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="/depart/">部门管理</a></li><li class="breadcrumb-item active" aria-current="page">添加部门</li></ol></nav><form method="post" action="/depart/add/">{% csrf_token %}<div class="mb-3 row"><label for="formGroupExampleInput" class="col-sm-2 col-form-label">部门名称</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="部门名称" name="name"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">部门描述</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="部门描述" name="description"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">父部门</label><div class="col-sm-10"><select  class="form-select" name="parent"><option value="0">请选择部门</option>{% for depart in departs %}<option value="{{ depart.id }}">{{ depart.name }}</option>{% endfor %}</select></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">属性设定</label><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_active" checked><label class="form-check-label" for="gridCheck">是否启用</label></div><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_locked" ><label class="form-check-label" for="gridCheck">是否锁定</label></div></div><button type="submit" class="btn btn-primary" >保存并返回</button></form></div>
</body>
</html>

 外观

 

部门编辑模板depart_edit.html

 源代码

<!DOCTYPE html>
{% load static %}
<html lang="en">
<head><meta charset="UTF-8"><title>部门管理</title><link rel="stylesheet" href="{% static 'bootstrap5/css/bootstrap.min.css' %}">
</head>
<body><div class="container"><nav aria-label="breadcrumb" style="margin: 10px 0"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="/depart/">部门管理</a></li><li class="breadcrumb-item active" aria-current="page">编辑部门</li></ol></nav><form method="post" action="/depart/edit/">{% csrf_token %}<div class="mb-3 row"><label for="formGroupExampleInput" class="col-sm-2 col-form-label">部门ID</label><div class="col-sm-10"><input type="text" class="form-control" readonly placeholder="" name="id" value="{{depart.id}}"></div></div><div class="mb-3 row"><label for="formGroupExampleInput" class="col-sm-2 col-form-label">部门名称</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="部门名称" name="name"  value="{{depart.name}}"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">部门描述</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="部门描述" name="description"  value="{{depart.description}}"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">父部门</label><div class="col-sm-10"><select  class="form-select" name="parent"><option  value="-1">请选择部门</option>{% for depart1 in departs %}{% if depart1.id == depart.parent %}<option selected value="{{ depart1.id }}">{{ depart1.name }}(id={{ depart1.id }})</option>{% else %}<option value="{{ depart1.id }}">{{ depart1.name }}(id={{ depart1.id }})</option>{% endif %}{% endfor %}</select></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">属性设定</label><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_active"{% if depart.is_active %}checked{% endif %}><label class="form-check-label" for="gridCheck">是否启用</label></div><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_locked"{% if depart.is_locked %}checked{% endif %}><label class="form-check-label" for="gridCheck">是否锁定</label></div></div><button type="submit" class="btn btn-primary" >保存并返回</button></form></div>
</body>
</html>

外观

6.URL配置

from django.contrib import admin
from django.urls import path,include
from django.conf.urls.i18n import i18n_patterns
from django.utils.translation import gettext_lazy as _
from app01 import viewsurlpatterns = [# path('admin/', admin.site.urls),# path('depart/', views.depart),# path('depart/add/', views.depart_add),# path('depart/edit/', views.depart_edit),# path('depart/delete/', views.depart_del),
]
urlpatterns += i18n_patterns(path('admin/', admin.site.urls),path('depart/', views.depart),path('depart/add/', views.depart_add),path('depart/edit/', views.depart_edit),path('depart/delete/', views.depart_del),
)


http://www.ppmy.cn/devtools/52317.html

相关文章

示例:WPF中绑定枚举到ComboBox的方式

一、目的&#xff1a;在开发过程中&#xff0c;经常会需要把枚举绑定到ComboxBox下拉列表中&#xff0c;其实方法有很多&#xff0c;这里面通过MarkupExtension扩展GetEnumSourceExtension去绑定到列表 二、实现 定义GetEnumSourceExtension类 public class GetEnumSourceExte…

基于变分自动编码器VAE的电池剩余使用寿命RUL估计

加载模块 import math import itertools import numpy as np import pandas as pd import seaborn as sns import tensorflow as tf from keras import layers from sklearn.svm import SVR from tensorflow import keras from keras import backend as K import matplotlib.p…

C语言----字符函数和字符串函数

在编程的过程中&#xff0c;我们要经常处理字符和字符串&#xff0c;为了方便操作字符和字符串&#xff0c;c语言标准库中提供的一系列库函数&#xff0c;接下来我们就开始学习与认识他们 1.字符分类函数 c语言中有一系列的函数是专门做字符分类的&#xff0c;也就是一个字符…

【cocos creator 3.x】 修改builtin-unlit 加了一个类似流光显示的mask参数

效果见图&#xff1a; shader 代码修改如下&#xff0c; 主要看 USE_MASK_UVY 关键字部分修改&#xff1a; // Copyright (c) 2017-2020 Xiamen Yaji Software Co., Ltd. CCEffect %{techniques:- name: opaquepasses:- vert: unlit-vs:vertfrag: unlit-fs:fragproperties: &a…

Kaggle比赛:成人人口收入分类

拿到数据首先查看数据信息和描述 import pandas as pd import seaborn as sns import matplotlib.pyplot as plt # 加载数据&#xff08;保留原路径&#xff0c;但在实际应用中建议使用相对路径或环境变量&#xff09; data pd.read_csv(r"C:\Users\11794\Desk…

VMware Workstation Ubuntu server 24 (Linux) 磁盘扩容 挂载硬盘

1 Ubuntu server 关机,新增加磁盘 2 启动ubuntu虚拟机,分区和挂载磁盘 sudo fdisk /dev/sdb #查看磁盘UUID sudo blkid #创建挂载目录 sudo mkdir /mnt/data # sudo vi /etc/fstab /dev/disk/by-uuid/0b440ed0-b28b-4756-beeb-10c585e3d101 /mnt/data ext4 defaults 0 1 #加…

Xlua三方库Android编译出错解决办法

Xlua三方库Android编译出错解决办法 最近听老师的热更教程&#xff0c;讲到xlua编译android平台会报错&#xff0c;也是看了老师的博客&#xff0c;按照方法去解决&#xff0c;然而问题并没有解决。应该是因为代码更新或者版本不一样&#xff0c;在此简单记录一下解决过程。 参…

租房项目之并发缺失数据问题

前奏&#xff1a;本项目是一个基于django的租房信息获取项目。本次博客牵扯到两个版本&#xff0c;集中式分布以及分布式部署&#xff08;两个版本的ui不同&#xff0c;集中式用的是老版ui&#xff0c;分布式使用的是新版ui&#xff09;&#xff1b; 项目链接&#xff1a;http…