【Django】教程-11-ajax弹窗实现增删改查
【Django】教程-1-安装+创建项目+目录结构介绍
【Django】教程-2-前端-目录结构介绍
【Django】教程-3-数据库相关介绍
【Django】教程-4-一个增删改查的Demo
【Django】教程-5-ModelForm增删改查+规则校验【正则+钩子函数】
【Django】教程-6-搜索框-条件查询前后端
【Django】教程-7-分页，默认使用django的
【Django】教程-8-页面时间组件
【Django】教程-9-登录+退出
【Django】教程-10-ajax请求Demo，结合使用
17. ajax弹窗方式实现-增删改查
由下面几个模块组成 ： model -> From -> urls -> views ->html
17.1 model
models.py
from django.utils import timezone
from django.db import models
class Order(models.Model):
""" 订单表"""
num = models.CharField(verbose_name="订单号", max_length=64)
goods_name = models.CharField(verbose_name="商品名称", max_length=64)
price = models.IntegerField(verbose_name="价格")
status_choices = (
(1, "待支付"),
(2, "已支付"),
)
status = models.SmallIntegerField(verbose_name="订单状态", choices=status_choices, default=1)
seller = models.ForeignKey(verbose_name="客服", to="UserInfo", on_delete=models.CASCADE)
class UserInfo(models.Model):
'''用户表'''
name = models.CharField(verbose_name="姓名", max_length=32)
password = models.CharField(verbose_name="密码", max_length=64)
age = models.IntegerField(verbose_name="年龄")
# create_time = models.DateTimeField(verbose_name="创建时间", default=timezone.now)
create_time = models.DateField(verbose_name="创建时间", default=timezone.now)
depart = models.ForeignKey(verbose_name="部门", to="Department", to_field="id", null=True, blank=True,
on_delete=models.SET_NULL)
gender_choices = (
(1, "男"),
(2, "女"),
)
gender = models.SmallIntegerField(verbose_name="性别", choices=gender_choices, default=1)
# 数据状态
status_choices = (
(1, "已删除"),
(0, "可用"),
)
status = models.SmallIntegerField(verbose_name="数据状态", choices=status_choices, default=0)
def __str__(self):
return self.name
17.2 Form
forms.py
from django import forms
from django.core.exceptions import ValidationError
from django.core.validators import RegexValidator
from . import models
from .models import Department, UserInfo, Admin, Order
from .util.md5 import md5
class BootstrapModelForm(forms.ModelForm):
def __init__(self, *args, **kwargs):
super().__init__(*args, **kwargs)
# 循环Modelform中所有字段，给每个字段插件设置
for name, field in self.fields.items():
if field.widget.attrs:
field.widget.attrs["class"] = "form-control"
field.widget.attrs["placeholder"] = field.label
else:
field.widget.attrs = {"class": "form-control", "placeholder": field.label}
def as_div(self):
"""
自定义表单渲染方法，将错误信息显示在字段下方并设置为红色
"""
output = []
for bound_field in self:
label_html = f'">{bound_field.label}'
field_html = f'{label_html}{bound_field}'
if bound_field.errors:
error_html = ''.join([f'{error}' for error in bound_field.errors])
field_html += f''
output.append(field_html)
return '\n'.join(output)
class OrderForm(BootstrapModelForm):
class Meta:
model = Order
# fields = "__all__"
exclude = ["num", "id"]
17.3 urls
urls.py
from django.contrib import admin
from django.urls import path
from appTang.views import department_views, user_views, admin_views, account, order_view
# 映射关系，视图--->函数
urlpatterns = [
# --------------------订单管理------------
path('order/list', order_view.list),
path('order/add', order_view.add),
path('order/del', order_view.delete),
path('order/detail', order_view.detail),
path('order/edit', order_view.edit),
]
17.4 views
views.py
import random
from datetime import datetime
from django.core.paginator import Paginator
from django.http import JsonResponse
from django.shortcuts import redirect, render
from django.views.decorators.csrf import csrf_exempt
from appTang.forms import OrderForm
from appTang.models import Order
def list(request):
"""用户展示"""
# 搜索条件
data_dict = {}
query_name = request.GET.get("query_name", "") # 第二个值是默认值, 也可以写if判断
if query_name:
data_dict["name__contains"] = query_name
order_list = Order.objects.filter(**data_dict).order_by("-id")
paginator = Paginator(order_list, 5)
# 获取当前页码，默认为第 1 页
page_number = request.GET.get('page')
page_obj = paginator.get_page(page_number)
context = OrderForm()
return render(request, 'order/order_list.html', {'page_obj': page_obj, 'context': context})
@csrf_exempt
def add(request):
form = OrderForm(data=request.POST)
if form.is_valid():
form.instance.num = datetime.now().strftime('%Y%m%d%H%M%S') + str(random.randint(1000, 9999))
form.save()
return JsonResponse({"status": True})
return JsonResponse({"status": False, "error": form.errors})
def delete(request):
"""删除订单"""
uid = request.GET.get("uid")
exists = Order.objects.filter(id=uid).exists()
if not exists:
return JsonResponse({"status": False, "error": "数据不存在，删除失败！"})
Order.objects.filter(id=uid).delete()
return JsonResponse({"status": True})
def detail(request):
"""编辑订单，回显"""
uid = request.GET.get("uid")
row_dict = Order.objects.filter(id=uid).values("goods_name", "status", "price", "seller").first()
if not row_dict:
return JsonResponse({"status": False, "error": "数据不存在，编辑失败！"})
return JsonResponse({"status": True, "data": row_dict})
@csrf_exempt
def edit(request):
"""编辑订单"""
uid = request.GET.get("uid")
row_obj = Order.objects.filter(id=uid).first()
if not row_obj:
return JsonResponse({"status": False, "tips": "数据不存在！请刷新重试！"})
form = OrderForm(data=request.POST, instance=row_obj)
if form.is_valid():
form.save()
return JsonResponse({"status": True})
return JsonResponse({"status": False, "error": form.errors})
17.5 html
order_list.html
{% extends 'login/layout.html' %}
{% load static %}
{% block content %}
<div class="container">
<div style="margin-bottom: 10px">
<input id="btnAdd" type="button" value="新建订单js" class="btn btn-success">
<input type="button" value="新建订单2-css" class="btn btn-success" data-toggle="modal" data-target="#myModal">
div>
<div class="panel panel-default">
<div class="panel-heading"><span class="glyphicon glyphicon-th-list" aria-hidden="true">span>订单列表
div>
<table class="table table-bordered">
<thead>
<tr>
<th>#th>
<th>订单号th>
<th>商品名称th>
<th>价格th>
<th>状态th>
<th>客服th>
<th>操作th>
tr>
thead>
<tbody>
{% for i in page_obj %}
<tr>
<td>{{ i.id }}td>
<td>{{ i.num }}td>
<td>{{ i.goods_name }}td>
<td>{{ i.price }}td>
<td>{{ i.get_status_display }}td>
<td>{{ i.seller }}td>
<td>
<input uid="{{ i.id }}" class="btn btn-primary btn-xs btn-edit" type="button" value="编辑">
<input uid="{{ i.id }}" class="btn btn-danger btn-xs btn-delete" type="button" value="删除">
td>
tr>
{% endfor %}
tbody>
table>
div>
<nav aria-label="分页">
<ul class="pagination justify-content-center"
style="display: flex; flex-wrap: nowrap; align-items: center;">
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link" href="?page=1">首页a>
li>
{% else %}
<li class="page-item disabled">
<span class="page-link">首页span>
li>
{% endif %}
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.previous_page_number }}">上一页a>
li>
{% else %}
<li class="page-item disabled">
<span class="page-link">上一页span>
li>
{% endif %}
<li class="page-item" style="margin: 0 5px;">
<select class="form-control" onchange="goToPage(this.value)">
{% for page_num in page_obj.paginator.page_range %}
17.6 目录结构
