day51作业
利用无名有名分组加反向解析完成用户数据的编辑和删除功能
目录结构
day51：
- app01
- day51
- static
- templates
- manage.py
功能截图
代码实现
day51/urls.py
from django.conf.urls import url,include
from django.contrib import admin
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^app01/', include('app01.urls')),
]
app01/urls.py
from django.conf.urls import url,include
from app01 import views
urlpatterns = [
url(r'^index/', views.index,name='i'),
url(r'add_user/', views.add_user, name='add'),
url(r'edit_user/(\d+)',views.edit_user,name='edit'),
url(r'delete_user/(\d+)',views.delete_user,name='delete'),
]
app01/views.py
from django.shortcuts import render,HttpResponse,redirect,reverse
from app01 import models
# Create your views here.
def index(request):
user_list = models.User.objects.all()
return render(request,'index.html',{"user_list":user_list})
# 新增用户
def add_user(request):
if request.method == "POST":
username = request.POST.get('username')
age = request.POST.get('age')
addr = request.POST.get('addr')
salary = request.POST.get('salary')
models.User.objects.create(username=username,age=age,addr=addr,salary=salary)
return redirect(reverse('i'))
return render(request,'add_user.html')
def edit_user(request,edit_id):
user_obj = models.User.objects.filter(id=edit_id)
if request.method == "POST":
username = request.POST.get('username')
age = request.POST.get('age')
addr = request.POST.get('addr')
salary = request.POST.get('salary')
models.User.objects.filter(id=edit_id).update(username=username,age=age,addr=addr,salary=salary)
return redirect(reverse('i'))
return render(request,'edit_user.html',{"user_obj":user_obj[0]})
def delete_user(request,delete_id):
models.User.objects.filter(id=delete_id).delete()
return redirect(reverse('i'))
数据库配置
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'day51',
'USER':'root',
'PASSWORD':'123',
'HOST':'192.168.32.130',
'CHARSET':'utf8',
}
}
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#导航条#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- 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="{% url 'i' %}">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="{% url 'i' %}">用户列表</a></li>
{# <li><a href="#">作者列表</a></li>#}
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">登录 / 注册</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</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><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center ">用户列表
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
<!--搜索按钮-->
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="exampleInputAmount">搜索</label>
<div class="input-group">
<input type="text" class="form-control" id="exampleInputAmount" placeholder="搜索">
</div>
</div>
<button type="submit" class="btn btn-primary">搜索</button>
<!--新增按钮-->
<a href="{% url 'add' %}" class="btn btn-success pull-right">新增</a>
</form>
<br>
<table class="table-hover table-bordered table-striped table">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>年龄</th>
<th>地址</th>
<th>薪资</th>
<th>操作</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ user.id }}</td>
<td>{{ user.username }}</td>
<td>{{ user.age }}</td>
<td>{{ user.addr }}</td>
<td>{{ user.salary }}</td>
<td>
<a href="{% url 'edit' user.id %}" class="btn btn-primary">编辑</a>
<a href="{% url 'delete' user.id %}" class="btn-danger btn" onclick="return confirm('是否确认要删除')">删除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{# 分页开始#}
<nav aria-label="Page navigation" class="text-center">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
{# 分页结束#}
</div>
</div>
</div>
</div>
</div>
</body>
</html>
add_user.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#导航条#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- 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="{% url 'i' %}">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="{% url 'i' %}">用户列表</a></li>
{# <li><a href="#">作者列表</a></li>#}
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">登录 / 注册</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</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><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center">添加用户
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
{# <br>#}
{# <div>#}
<form action="" method="post">
<p>
用户名：
<input type="text" name="username" class="form-control">
</p>
<p>
年龄：
<input type="text" name="age" class="form-control">
</p>
<p>
地址：
<input type="text" name="addr" class="form-control">
</p>
<p>
薪资：
<input type="text" name="salary" class="form-control">
</p>
<p>
<input type="submit" value="提交" class="btn btn-primary">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
edit_user.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
<script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
</head>
<body>
{#导航条#}
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- 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="{% url 'i' %}">Home</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="{% url 'i' %}">用户列表</a></li>
{# <li><a href="#">作者列表</a></li>#}
<li class="dropdown"></li>
</ul>
<form class="navbar-form navbar-left">
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">登录 / 注册</a></li>
<li class="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</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><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-primary">
<div class="panel panel-heading panel-primary text-center">编辑用户
<span class="glyphicon glyphicon-book pull-right"></span>
</div>
<div class="panel-body">
{# <br>#}
{# <div>#}
<form action="" method="post">
<p>
用户名：
<input type="text" name="username" value="{{ user_obj.username }}" class="form-control">
</p>
<p>
年龄：
<input type="text" name="age" value="{{ user_obj.age }}" class="form-control">
</p>
<p>
地址：
<input type="text" name="addr" value="{{ user_obj.addr }}" class="form-control">
</p>
<p>
薪资：
<input type="text" name="salary" value="{{ user_obj.salary }}" class="form-control">
</p>
<p>
<input type="submit" value="提交" class="btn btn-primary">
</p>
</form>
{# </div>#}
</div>
</div>
</div>
</div>
</div>
</body>
</html>
浙公网安备 33010602011771号