页面表格展现数据
修改功能的逻辑
- 修改哪条记录?如何确定?可否通过主键Id锁定
- 点击修改的按钮,应该跳转到一个修改的页面
- 应该通过ID查询到原来的数据,并且把这个记录的数据展示到修改的页面
- 开始修改,提交到后端的修改数据的方法中
删除功能的逻辑
- 确定杉树哪条记录,怎么确定?通过主键ID确定唯一一条记录
- 点击删除的按钮,请求到后端的删除地址
- 后端拿到ID直接做删除操作、跳转到列表页面
实现
创建表格
在settings.py选择数据库
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'Django',
'HOST': '127.0.0.1', # 本机
'PORT': 3306, # 端口
'USER': 'root', # 用户名
'PASSWORD': 'a1234567', # 密码
'CHARSET': 'UTF-8'
}
}
在models.py里面添加表
from django.db import models
# Create your models here.
class UserInfo(models.Model):
username = models.CharField(max_length=64, verbose_name='用户名')
password = models.CharField(max_length=64, verbose_name='密码')
age = models.IntegerField()
gender = models.CharField(max_length=64, verbose_name='性别')
major = models.CharField(max_length=64, verbose_name='专业')
在views.py里面添加数据
from django.shortcuts import render,HttpResponse
# Create your views here.
from demo import models
def index(request):
# 增加数据
models.UserInfo.objects.create(username='JJ',password=123,age=25,gender='Male',major='CS')
models.UserInfo.objects.create(username='Kevin',password=321,age=25,gender='Male',major='EE')
models.UserInfo.objects.create(username='Jack',password=123,age=18,gender='Male',major='MAT')
models.UserInfo.objects.create(username='Marry',password=321,age=21,gender='Female',major='ECN')
models.UserInfo.objects.create(username='Kathy',password=123,age=25,gender='Female',major='ECN')
models.UserInfo.objects.create(username='Maria',password=321,age=30,gender='Female',major='DRA')
return HttpResponse("OK")
在urls.py里面添加路由
from django.contrib import admin
from django.urls import path
from demo import views
urlpatterns = [
path('admin/', admin.site.urls),
path('index/', views.index),
]
到这步为止,数据应该都成功添加
数据的展示
动静态网页
静态网页--->在页面上写死的数据,一直不会改变
动态网页--->在动态网页是从后端获取到的数据在页面展示,数据在数据库中查询出来的也是动态。
后端数据展示到界面
在views里面的几种写法:
第一种写法
def ab_render(request):
user_dict = {'username':'JJ', 'age':23}
return render(request,"ab_render.html" , {'user_dict':user_dict})
第二种写法
def ab_render(request):
user_dict = {'username':'JJ', 'age':23}
return render(request,"ab_render.html" , user_dict)
第三种写法
# 模版变量的分配
def ab_render(request):
user_dict = {'username':'JJ', 'age':23}
return render(request,"ab_render.html" , locals())
分别对应HTML文件里的写法
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
<meta charset="UTF-8">
<title>ab_render</title>
</head>
<body>
<h1>{{ user_dict.username }}</h1>
<h1>{{ username }}</h1>
<h1>{{ user_dict.username}}</h1>
</body>
</html>
循环展示列表数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>userlist</title>
<script src="/static/js/jquery.js"></script>
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<h1 class="text-center">用户数据展示</h1>
<table class="table table-hover table-striped table-bordered ">
<thead>
<tr>
<th class="text-center">ID</th>
<th class="text-center">用户名</th>
<th class="text-center">密码</th>
<th class="text-center">年龄</th>
<th class="text-center">性别</th>
<th class="text-center">专业</th>
<th class="text-center">操作</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td class="text-center">{{ user.id }}</td>
<td class="text-center">{{ user.username }}</td>
<td class="text-center">{{ user.age }}</td>
<td class="text-center">{{ user.gender }}</td>
<td class="text-center">{{ user.major }}</td>
<td class="text-center">{{ user.password }}</td>
<td class="text-center">
<a href="" class="btn btn-danger btn-xs">删除</a>
<a href="" class="btn btn-success btn-xs">修改</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</body>
</html>
值得我们注意的是Django模版语法:
{{ user.id }}