当前位置： 首页 > news >正文

django实现部门表的增删改查界面

news 2026/4/19 1:24:13

1、前期准备

  • 部署好mysql数据库，创建好unicom数据库
  • 下载好bootstap的插件
  • 下载好jquery的插件
  • 下载好mysqlclient-1.4.6-cp36-cp36m-win_amd64.whl的安装包，根据python的版本下载

2、创建项目

在pycharm中创建项目在这里插入图片描述
在pycharm的终端创建虚拟环境

 py -m venv venv

激活虚拟环境
在这里插入图片描述
在这里插入图片描述
这样就可以自动激活虚拟环境了
再安装需要的模块

pip install django

把mysqlclient-1.4.6-cp36-cp36m-win_amd64.whl放到项目跟目录

 pip install mysqlclient-1.4.6-cp36-cp36m-win_amd64.whl

配置数据库，打开settings.py


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

创建app

py manage.py startapp app01

注册app,在settings.py中添加最后一行
在这里插入图片描述

3、使用django创建数据库表

在app01的目录下的models.py中写如下代码
创建一个Department的表，有一个部门名称的字段，title
django会自动给每个表加上自增长id字段

from django.db import models# Create your models here.class Department(models.Model):"""部门表"""title = models.CharField(verbose_name="标题",max_length=32)

执行数据库执行命令

py -3 manage.py makemigrations
py -3 manage.py migrate

4、导航条编写

使用bootsrap的
需要引入静态文件
在这里插入图片描述
因为有不同的页面，所以我们使用模板继承，把导航条写在一个模板文件中，layout.html
进入https://v3.bootcss.com/components/ 的官网，找到导航条
在这里插入图片描述
把这个导航条的代码拷贝到自己的layout.html文件中，在根据自己的需要做修改
在这里插入图片描述
修改后的layout.html内容如下：

{% load static %}<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>部门管理</title><link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1/css/bootstrap.min.css' %}">{% block css %}{% endblock%}<style>.navbar {border-radius: 0;}</style>
</head>
<body>
<nav class="navbar navbar-default"><div class="container"><!-- Brand and toggle get grouped for better mobile display --><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse"data-target="#bs-example-navbar-collapse-1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="#">用户管理系统</a></div><!-- Collect the nav links, forms, and other content for toggling --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li class="active"><a href="#">部门管理 <span class="sr-only">(current)</span></a></li><li><a href="#">用户管理</a></li></ul><ul class="nav navbar-nav navbar-right"><li><a href="#">登录</a></li><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"aria-expanded="false">张顺 <span class="caret"></span></a><ul class="dropdown-menu"><li><a href="#">个人信息</a></li><li><a href="#">注销</a></li><li><a href="#">Something else here</a></li><li role="separator" class="divider"></li><li><a href="#">Separated link</a></li></ul></li></ul></div></div>
</nav>
<div>{% block content %}{% endblock%}
</div>
<script src="{% static 'js/jquery-3.7.0.min.js' %}"></script>
<script src="{% static 'plugins/bootstrap-3.4.1/js/bootstrap.min.js' %}"></script>{% block js %}{% endblock%}
</body>
</html>

5、部门列表编写

在urls.py中定义好路由

from django.urls import path
from app01 import viewsurlpatterns = [path('depart/list/', views.depart_list),
]

在views.py中定义函数

from django.shortcuts import render,redirect,HttpResponse
from app01 import models
def depart_list(request):"""部门管理"""#去数据库中获取所有的部门列表#[对象]queryset = models.Department.objects.all()return render(request,'depart_list.html',{'queryset':queryset})

将从数据库获取的对象传给depart_list.html页面，页面循环显示
使用了bootstrap的面板和表格，所有的html都放到app01的templates目录

{% extends 'layout.html' %}{% block content %}<div class="container"><div style="margin-bottom: 10px"><a class="btn btn-success" href="/depart/add/">新建部门</a></div><div class="panel panel-default"><div class="panel-heading" ><span class="glyphicon glyphicon-list" aria-hidden="true"></span> 部门列表</div><table class="table table-bordered"><thead><tr><th>ID</th><th>名称</th><th>操作</th></tr></thead><tbody>{% for item in queryset %}<tr><td>{{ item.id }}</td><td>{{ item.title }}</td><td><a class="btn btn-primary btn-xs" href="/depart/{{ item.id }}/edit/">编辑</a><a class="btn btn-danger btn-xs" href="/depart/delete/?nid={{ item.id }}">删除</a></td></tr>{% endfor %}</tbody></table></div></div>{% endblock %}

运行项目的效果
在这里插入图片描述

6、添加部门

在部门列表展示页，点击新建部门需要跳转到新建部门的页面/depart/add/， 下面先定义路由

from django.urls import path
from app01 import viewsurlpatterns = [path('depart/list/', views.depart_list),path('depart/add/', views.depart_add),
]

在urls.py中定义函数
如果是get请求就返回depart_add.html部门添加的页面，如果是添加了数据，post提交数据，就先获取post提交过来的部门名称title，保存数据到数据库，最后在返回到部门列表

from django.shortcuts import render,redirect,HttpResponse
from app01 import modelsdef depart_add(request):"""添加部门"""if request.method=='GET':return render(request,'depart_add.html')#获取用户POST提交过来的数据title = request.POST.get("title")#保存数据到数据库models.Department.objects.create(title=title)#重定向回部门列表return redirect("/depart/list/")

在写depart_add.html，

{% extends 'layout.html' %}{% block content %}<div class="container"><div class="panel panel-default"><div class="panel-heading">新建部门</div><div class="panel-body"><form class="form-horizontal" method="post">{% csrf_token %}<div class="form-group"><label  class="col-sm-2 control-label">部门名称</label><div class="col-sm-10"><input type="text" class="form-control" name="title" placeholder="部门名称"></div></div><div class="form-group"><div class="col-sm-offset-2 col-sm-10"><button type="submit" class="btn btn-primary">提交</button></div></div></form></div></div></div>{% endblock %}

效果如下：
在这里插入图片描述

7、删除部门

定义路由，urls.py

from django.urls import path
from app01 import viewsurlpatterns = [path('depart/list/', views.depart_list),path('depart/add/', views.depart_add),path('depart/delete/', views.depart_delete),
]

views.py 定义函数
通过在get路径后面传nid 来表示要删除的id,这个值是在depart_list.html中，当点击删除的时候带出来的
在这里插入图片描述

from django.shortcuts import render,redirect,HttpResponse
from app01 import modelsdef depart_delete(request):"""删除部门"""# http://127.0.0.1:8000/depart/delete/?nid=1#获取nidnid = request.GET.get("nid")#删除数据库id为nid的值models.Department.objects.filter(id=nid).delete()return redirect("/depart/list/")

8、编辑部门

定义路由，urls.py， 将要编辑的id放到访问路径中

from django.urls import path
from app01 import viewsurlpatterns = [path('depart/list/', views.depart_list),path('depart/add/', views.depart_add),path('depart/delete/', views.depart_delete),#http://127.0.0.1:8000/depart/2/edit/path('depart/<int:nid>/edit/', views.depart_edit),
]

views.py 如果是get 请求根据nid获取数据库的对象，对象包含id 和title,将title传给编辑页面，显示当前编辑的是什么数据
提交数据后修改数据库的title字段，重定向到部门列表页面

from django.shortcuts import render,redirect,HttpResponse
from app01 import models
##http://127.0.0.1:8000/depart/2/edit/
def depart_edit(request,nid):"""编辑部门"""if request.method == 'GET':# http://127.0.0.1:8000/depart/2/edit/row_query = models.Department.objects.filter(id=nid).first()return render(request,'depart_edit.html',{'row_query':row_query})#获取用户提交的标题title = request.POST.get("title")#修改数据库部门名称字段models.Department.objects.filter(id=nid).update(title=title)return redirect("/depart/list/")

depart_edit.html 页面，根添加的页面差不多的

{% extends 'layout.html' %}{% block content %}<div class="container"><div class="panel panel-default"><div class="panel-heading">编辑部门</div><div class="panel-body"><form class="form-horizontal" method="post">{% csrf_token %}<div class="form-group"><label  class="col-sm-2 control-label">部门名称</label><div class="col-sm-10"><input type="text" class="form-control" name="title" placeholder="部门名称" value="{{ row_query.title }}"></div></div><div class="form-group"><div class="col-sm-offset-2 col-sm-10"><button type="submit" class="btn btn-primary">提交</button></div></div></form></div></div></div>{% endblock %}

相关文章：

django实现部门表的增删改查界面

1、前期准备 部署好mysql数据库&#xff0c;创建好unicom数据库下载好bootstap的插件下载好jquery的插件下载好mysqlclient-1.4.6-cp36-cp36m-win_amd64.whl的安装包&#xff0c;根据python的版本下载 2、创建项目 在pycharm中创建项目 在pycharm的终端创建虚拟环境 py -m v…...

编程日记 2023/8/4 2:38:29

Tomcat的介绍和安装配置、eclipse中动态web项目的创建和运行、使用IDEA创建web项目并运行

一、Tomcat的介绍和安装配置 安装tomcat&#xff1a; 环境变量的配置&#xff1a; 配置之后重启cmd&#xff0c;执行startup命令&#xff0c;启动tomcat 在localhost:8080&#xff0c;能进入tomcat主界面&#xff0c;说明配置成功 二、eclipse中动态web项目的创建和运行 tomca…...

编程日记 2023/8/4 2:37:27

idea操作——已经push到远程的代码回滚（不保留本地更改）

1. git&#xff1a; 2. 找到相应分支--->找到要回滚的代码的位置----->右键&#xff0c;然后选择如图的选项&#xff1a; 3.下图的选项选择hard&#xff0c;然后选择reset 4.操作完成后等一会&#xff0c;待同步结束后push代码到远程&#xff0c;选择force push.&#xf…...

编程日记 2023/8/4 2:36:25

无涯教程-Lua - 垃圾回收

Lua使用自动内存管理&#xff0c;该管理使用基于Lua内置的某些算法的垃圾回收。 垃圾收集器暂停 垃圾收集器暂停用于控制垃圾收集器之前需要等待多长时间&#xff1b; Lua的自动内存管理再次调用它。值小于100意味着Lua将不等待下一个周期。同样&#xff0c;此值的较高值将导…...

编程日记 2023/8/4 2:35:24

DP(各种模型）

数字三角形模型 摘花生 Hello Kitty想摘点花生送给她喜欢的米老鼠。 她来到一片有网格状道路的矩形花生地(如下图)&#xff0c;从西北角进去&#xff0c;东南角出来。 地里每个道路的交叉点上都有种着一株花生苗&#xff0c;上面有若干颗花生&#xff0c;经过一株花生苗就…...

编程日记 2023/8/4 2:34:20

开学在即，这个超好用的中小学新生录取查询系统制作方法值得借鉴

即将开学&#xff0c;中小学负责招生的老师面临着新学年的招生工作。这是一项紧迫且重要的任务&#xff0c;需要老师们迅速而有效地应对。在新生录取过程中&#xff0c;有几个关键任务需要尽快完成。 首先&#xff0c;老师们需要录入新生的成绩信息。这包括学生的考试成绩、综…...

编程日记 2023/8/4 2:33:19

使用Canvas裁剪图片

使用Canvas裁剪图片 概述 在Web开发中&#xff0c;我们经常需要对图片进行裁剪&#xff0c;以满足不同尺寸需求或者实现图片的局部展示。本篇博客将带您深入了解如何使用Canvas技术来实现图片的裁剪功能。我们将通过一个实例来演示如何利用Canvas绘制图片&#xff0c;并通过蒙…...

编程日记 2023/8/4 2:32:18

JavaScript |（三）内建对象 | 数组 | string对象 | 尚硅谷JavaScript基础实战

学习来源&#xff1a;尚硅谷JavaScript基础&实战丨JS入门到精通全套完整版 文章目录 &#x1f4da;数组&#x1f407;数组介绍⭐️数组&#xff08;Array&#xff09;⭐️基本操作⭐️数组的字面量 &#x1f407;数组中的常用方法⭐️push()⭐️pop()⭐️unshift()⭐️shif…...

编程日记 2023/8/4 2:31:17

势能线段树

目录 简单介绍 题目 1. 上帝造题的七分钟 2 2.SUM and REPLACE 3. And RMQ 总结 简单介绍 题目 1. 上帝造题的七分钟 2 链接&#xff1a;https://www.luogu.com.cn/problem/P4145 维护两种操作 1.区间开根号(下取整) 2.区间和询问 显然无法通过懒标记来计算区间开根号…...

编程日记 2023/8/4 2:30:16

【phaser微信抖音小游戏开发004】往画布上增加文本以及文本的操作

我们在states中创建st004.js的类&#xff0c;或者将states中的index.js直接重命名为st004.js&#xff0c;把里面的类名也修改为st004.如下图 在main.js中&#xff0c;引入st004,并设置启用的state为st004。如下图 接下来到states/st004里面&#xff0c;在create里面将文本修改一…...

编程日记 2023/8/4 2:29:15

【1.4】Java微服务：服务注册和调用（Eureka和Ribbon实现）

✅作者简介&#xff1a;大家好&#xff0c;我是 Meteors., 向往着更加简洁高效的代码写法与编程方式&#xff0c;持续分享Java技术内容。 &#x1f34e;个人主页&#xff1a;Meteors.的博客 &#x1f49e;当前专栏&#xff1a; 微服务 ✨特色专栏&#xff1a; 知识分享 &#x…...

编程日记 2023/8/4 2:28:13

QT中使用ffmpeg的api进行视频的播放

在了解ffmpeg使用api进行视频的播放之前&#xff0c;我们首先了解一下视频的播放流程。 一、视频的播放流程 首先是我们最常见的视频文件&#xff0c;在播放流程中首先是要打开视频文件&#xff0c;将视频文件中的数据进行解封装&#xff0c;之后再将解封装之后的视频进行解码…...

编程日记 2023/8/4 2:27:09

使用idea实现git操作大全（在项目开发中遇到的实际情况

使用idea实现git操作大全&#xff08;在项目开发中遇到的实际情况&#xff09; 1.安装git插件2.在开发中切记拉一个自己的分支 1.安装git插件 2.在开发中切记拉一个自己的分支 选中需要拉的分支&#xff0c;右键该分支&#xff0c;选中new breach from “分支”&#xff0c;点…...

编程日记 2023/8/4 2:26:08

SQL面试题：一个优化案例

问题描述 假如存在以下两个表&#xff1a; CREATE TABLE customer ( C_CUSTKEY int NOT NULL, C_NAME varchar(25) NOT NULL, C_ADDRESS varchar(40) NOT NULL, C_NATIONKEY int NOT NULL, C_PHONE char(15) NOT NULL, C_ACCTBAL decimal(15,2) NOT NULL, C_MKTSEGMENT char(…...

编程日记 2023/8/4 2:25:07

链表的总体涵盖以及无哨兵位单链表实现——【数据结构】

&#x1f60a;W…Y&#xff1a;个人主页 在学习之前看一下美丽的夕阳&#xff0c;也是很不错的。 如果觉得博主的美景不错&#xff0c;博客也不错的话&#xff0c;关注一下博主吧&#x1f495; 在上一期中&#xff0c;我们说完了顺序表&#xff0c;并且提出顺序表中的问题 1. 中…...

编程日记 2023/8/4 2:24:06

网页版Java五子棋项目（一）websocket【服务器给用户端发信息】

网页版Java五子棋项目&#xff08;一&#xff09;websocket【服务器给用户端发信息】 一、为什么要用websocket二、websocket介绍原理解析 三、代码演示1. 创建后端api&#xff08;TestAPI&#xff09;新增知识点&#xff1a;extends TextWebSocketHandler重写各种方法 2. 建立…...

编程日记 2023/8/4 2:23:05

企业大数据可视化案例专题分享-入门

一、什么是数据可视化&#xff1f; 基本概念&#xff1a;数据可视化是以图示或图形格式表示的数据。让决策者可以看到以直观方式呈现的分析&#xff0c;以便他们可以掌握困难的概念或识别新的模式。借助交互式可视化&#xff0c;可以使用技术深入挖掘图表和图形以获取更多详细…...

编程日记 2023/8/4 2:22:04

GoogLeNet卷积神经网络-笔记

GoogLeNet卷积神经网络-笔记 GoogLeNet是2014年ImageNet比赛的冠军&#xff0c; 它的主要特点是网络不仅有深度&#xff0c; 还在横向上具有“宽度”。 由于图像信息在空间尺寸上的巨大差异&#xff0c; 如何选择合适的卷积核来提取特征就显得比较困难了。 空间分布范围更广的…...

编程日记 2023/8/4 2:21:02

腾讯云TencentOS Server镜像系统常见问题解答

腾讯云TencentOS Server镜像是腾讯云推出的Linux操作系统&#xff0c;完全兼容CentOS生态和操作方式&#xff0c;TencentOS Server操作系统为云上运行的应用程序提供稳定、安全和高性能的执行环境&#xff0c;TencentOS可以运行在腾讯云CVM全规格实例上&#xff0c;包括黑石物理…...

编程日记 2023/8/4 2:20:01

【项目 进程13】2.28共享内存（1） 2.29共享内存（2）

文章目录 2.28共享内存&#xff08;1&#xff09;共享内存&#xff08;效率最高&#xff0c;比内存映射更高。因为内存映射还需一个文件做载体&#xff09;共享内存使用步骤共享内存操作函数头文件 2.29共享内存&#xff08;2&#xff09;共享内存相关问题共享内存和内存映射的…...

编程日记 2023/8/4 2:18:57

第九篇技术笔记：PoDL：一根线，供电上网两不误

写在开篇&#xff1a;最近一位新疆美女导游特别火&#xff0c;说的也听感动&#xff1a;湾湾当归&#xff01;早日回到祖国的怀抱&#xff01;不是因为技术做不到&#xff0c;是因为那边有人需要。车载以太网也是这个道理。不是“把电源和数据放一根线上”这个技术有多难&#…...

编程新知 2026/4/19 1:12:01

企业云盘文件预览技术深度剖析：从10种常见格式到渲染架构实战

引子&#xff1a;那个凌晨3点接到电话的IT主管 凌晨3点&#xff0c;某制造企业的IT主管老张被一阵急促的手机铃声惊醒。生产线的工人发现&#xff0c;投标用的3D工程图纸在手机上打不开——甲方要求在投标截止前2小时内补充技术方案&#xff0c;手机里的图纸格式是SolidWorks的…...

编程新知 2026/4/18 23:03:01

HWIOAuthBundle性能优化：大规模用户认证的5个最佳实践

HWIOAuthBundle性能优化&#xff1a;大规模用户认证的5个最佳实践 【免费下载链接】HWIOAuthBundle OAuth client integration for Symfony. Supports both OAuth1.0a and OAuth2. 项目地址: https://gitcode.com/gh_mirrors/hw/HWIOAuthBundle HWIOAuthBundle作为Symfo…...

编程新知 2026/4/18 21:55:16

Eclipse CDT在嵌入式开发中的核心价值与实战技巧

1. Eclipse CDT在嵌入式开发中的核心价值Eclipse CDT&#xff08;C/C Development Tooling&#xff09;作为Eclipse平台上的C/C开发环境&#xff0c;已经成为嵌入式开发领域的事实标准。这个开源工具链之所以能在嵌入式领域占据主导地位&#xff0c;主要源于三个关键特性&#…...

编程新知 2026/4/18 20:50:08

《JAVA面经实录》- Web后端面试题

《JAVA面经实录》- Web后端面试题一、《JAVA面经实录》- HTTP面试题1.HTTP协议是什么&#xff1f;HTTP是一个基于TCP/IP通信协议来传递数据&#xff0c;包括html文件、图像、结果等&#xff0c;即是一个客户端和服务器端请求和应答的标准。基本上用到的就是GET和POST&#xff0…...

编程新知 2026/4/18 20:23:29

从源码到实战：在VS2022中集成curl网络库的完整指南

1. 为什么选择curl库&#xff1f; 如果你正在用C开发Windows应用程序&#xff0c;并且需要实现HTTP客户端功能&#xff0c;那么libcurl几乎是你的不二之选。作为一个成熟稳定的网络传输库&#xff0c;curl支持包括HTTP、HTTPS、FTP在内的多种协议&#xff0c;被广泛应用于各种开…...

编程新知 2026/4/18 19:18:17

微软为什么发明 SqlLocalDB？命令行直接启动，0配置成本

微软为什么发明 SqlLocalDB&#xff08;2012 首发&#xff0c;Denali 项目原生目标&#xff09; 1. 前代产品全部无解的历史痛点&#xff08;核心根源&#xff09; 在 LocalDB 诞生前&#xff0c;微软桌面本地数据库有三套方案&#xff0c;全部有致命缺陷&#xff0c;开发体验…...

编程新知 2026/4/18 19:03:44

Intv_AI_MK11 Node.js 环境集成教程：构建全栈智能应用

Intv_AI_MK11 Node.js 环境集成教程&#xff1a;构建全栈智能应用 1. 开篇&#xff1a;为什么选择Node.js集成AI能力 如果你是一名Node.js开发者&#xff0c;想要给自己的应用添加AI能力&#xff0c;这篇教程就是为你准备的。我们将一步步带你完成从零开始的环境搭建&#xf…...

编程新知 2026/4/18 18:51:12

051.数据库选型：为检测结果存储选择合适的数据库（SQLite/MySQL/PostgreSQL）

从一次线上事故说起 上个月深夜接到报警，部署在厂区的YOLO检测服务突然响应缓慢。登录服务器一看，发现检测结果写入数据库的线程全部卡死，前端页面加载历史记录要十几秒。查日志定位到问题：随着检测图片数量突破百万级，当初为了省事直接用的SQLite文件膨胀到8GB，并发写入…...

编程新知 2026/4/18 18:48:46

G-Helper：华硕笔记本性能调优的轻量级革命，三步解锁硬件控制新境界

G-Helper&#xff1a;华硕笔记本性能调优的轻量级革命&#xff0c;三步解锁硬件控制新境界 【免费下载链接】g-helper Lightweight, open-source control tool for ASUS laptops and ROG Ally. Manage performance modes, fans, GPU, battery, and RGB lighting across Zephyru…...

编程新知 2026/4/18 18:08:50