HTML页面的内容
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" href="/static/sweet/sweetalert.css"> <link rel="stylesheet" href="/static/fontawesome/css/font-awesome.min.css"> <link rel="stylesheet" href="/static/setup_ajax.js"> <style> .sweet-alert>h2{ padding-top:10px; } </style> </head> <body> <div class="container"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">人员管理表</h3> </div> <div class="panel-body"> <table class="table table-bordered"> <thead> <tr> <th>序号</th> <th>名字</th> <th>年龄</th> <th>生日</th> <th>操作</th> </tr> </thead> <tbody> {% for p in persons %} <tr> <td>{{ forloop.counter }}</td> <td>{{ p.name }}</td> <td>{{ p.age }}</td> <td>{{ p.birthday|date:"Y-m-d" }}</td> <td> <button class="btn btn-danger del"><i class="fa fa-trash-o">删除</i></button> </td> </tr> {% endfor %} </tbody> </table> </div> </div> </div> <script src="/static/jquery-3.3.1.min.js"></script> <script src="/static/bootstrap-3.3.7/js/bootstrap.min.js"></script> <script src="/static/sweet/sweetalert.min.js"></script> <script> //找到删除按钮绑定事件 $(".del").on("click",function () { var delid=$(this).parent().parent().children().eq(0).text(); swal({ title: "你确定要删除吗？", text: "一旦删除就找不回来了", type: "warning", showCancelButton: true, confirmButtonClass: "btn-danger", confirmButtonText: "确认", cancelButtonText: "取消", closeOnConfirm: false }, function(){ $.ajax({ url:"/delt/", type:"POST", data:{"id":delid}, success:function (arg) { swal(arg, "你可以跑路了", "success"); } }); }); }) </script> </body> </html>
view视图的函数
def delt(request):
del_id=request.POST.get("id")
print(del_id)
models.Person.objects.filter(id=del_id).delete()
return HttpResponse("删除成功!")
页面内容
