必做题:
1.整理今日内容到博客
2.自己完成单表的增删改查功能(结合前端鼠标点点操作)
3.自己找几张表练习如何创建表与表之间的关系
选做题:
1.尝试着利用路由匹配和反向解析完成数据的编辑和删除功能
2.构思图书管理系统(后面会讲,自己先尝试着看看)
单张表（增删改查）
urls.py
from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), # 首页 url(r'^$', views.home), # 编辑用户 url(r'^edit_user/', views.edit_user), # 删除用户 url(r'^delete_user/', views.delete_user), # 添加用户 url(r'^add_user/', views.add_user), ]
views.py
from django.shortcuts import render,HttpResponse,redirect from app01 import models # orm查询数据要依靠这个 # Create your views here. # 首页 def home(request): # 查询出用户表里面所有的数据 user_queryset = models.User.objects.all() # print(user_queryset) # <QuerySet [<User: egon>, <User: tank>, <User: alias>, <User: wangpeng>, <User: jc>]> # 因为在models.py中加了__str__方法，否则默认显示为<QuerySet [<User: User object>, <User: User object>, <User: User object>, <User: User object>, <User: User object>]> return render(request,'index.html',{"user_queryset":user_queryset}) # 编辑用户 def edit_user(request): # 接收前端发过来的user_id edit_id = request.GET.get("user_id") # 获取提交过来的用户名和密码 if request.method == "POST": username = request.POST.get("username") password = request.POST.get("password") # 去数据库中修改对应的数据内容 models.User.objects.filter(id=edit_id).update(username=username,password=password) """ 将filter查询出来的列表中所有的对象全部更新 批量更新操作 """ return redirect("http://127.0.0.1:8000") # 查询出想要编辑的用户信息,展示到前端供用户编辑 edit_obj = models.User.objects.filter(id=edit_id).first() #将数据对象展示到页面上 return render(request,"edit_user.html",{"edit_obj":edit_obj}) # 删除数据 def delete_user(request): # 接收前端发过来的user_id delete_id = request.GET.get("user_id") #直接去数据库中找到对应的数据删除 models.User.objects.filter(id=delete_id).delete() """ 批量删除 """ return redirect("http://127.0.0.1:8000") # 添加数据 def add_user(request): # 获取method方式 if request.method == "POST": username = request.POST.get("username") password = request.POST.get("password") # 判断用户是否存在 user_obj = models.User.objects.filter(username=username).first() if user_obj: return HttpResponse("用户已经存在") # 直接获取用户数据存入数据库 user_obj = models.User.objects.create(username=username,password=password) # 返回一个主页面 return redirect("http://127.0.0.1:8000") return render(request,"add_user.html")
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <!--类似于导模块--> {% load static %} <!-- Bootstrap3 核心 CSS 文件，本地导入 --> <link href="{% static "bootstrap-3.3.7-dist/css/bootstrap.min.css" %}" rel="stylesheet"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script src="{% static "js/jQuery_3.5.1.js" %}"></script> <!-- Bootstrap3 核心 JavaScript 文件 --> <script src="{% static "bootstrap-3.3.7-dist/js/bootstrap.min.js" %}"></script> </head> <body> <div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <h1 class="text-center">数据展示</h1> <p class="text-right"><a href="/add_user/" class="btn btn-success btn-xs">添加数据</a></p> <table class="table table-striped table-hover"> <thead> <tr> <th>id</th> <th>username</th> <th>password</th> <th>action</th> </tr> </thead> {% for user_obj in user_queryset %} <tr> <td>{{ user_obj.id }}</td> <td>{{ user_obj.username }}</td> <td>{{ user_obj.password }}</td> <td> <!--用户点了编辑之后，通过?后面跟k，v的方法将编辑的用户id发送给后端;/edit_user/?user_id={{ user_obj.id }}--> <a href="/edit_user/?user_id={{ user_obj.id }}" class="btn btn-primary btn-xs">编辑</a> <a href="/delete_user/?user_id={{ user_obj.id }}" class="btn btn-danger btn-xs">删除</a> </td> </tr> {% endfor %} </table> </div> </div> </div> </body> </html>
edit_user.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>数据编辑</title> <!--类似于导模块--> {% load static %} <!-- Bootstrap3 核心 CSS 文件，本地导入 --> <link href="{% static "bootstrap-3.3.7-dist/css/bootstrap.min.css" %}" rel="stylesheet"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script src="{% static "js/jQuery_3.5.1.js" %}"></script> <!-- Bootstrap3 核心 JavaScript 文件 --> <script src="{% static "bootstrap-3.3.7-dist/js/bootstrap.min.js" %}"></script> </head> <body> <div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <h1 class="text-center">数据编辑</h1> <form action="" method="post"> <p> 用户名: <input type="text" name="username" class="form-control" value="{{ edit_obj.username }}"> </p> <p> 密码: <input type="text" name="password" class="form-control" value="{{ edit_obj.password }}"> </p> <input type="submit" class="btn btn-info btn-block" value="编辑"> </form> </div> </div> </div> </body> </html>
add_user.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <!--类似于导模块--> {% load static %} <!-- Bootstrap3 核心 CSS 文件，本地导入 --> <link href="{% static "bootstrap-3.3.7-dist/css/bootstrap.min.css" %}" rel="stylesheet"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script src="{% static "js/jQuery_3.5.1.js" %}"></script> <!-- Bootstrap3 核心 JavaScript 文件 --> <script src="{% static "bootstrap-3.3.7-dist/js/bootstrap.min.js" %}"></script> </head> <body> <div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <h1 class="text-center">添加数据</h1> <form action="/add_user/" method="post"> <p> 用户名: <input type="text" name="username" class="form-control"> </p> <p> 密码: <input type="password" name="password" class="form-control"> </p> <input type="submit" class="btn btn-success btn-block" value="提交"> </form> </div> </div> </div> </body> </html>