book_list.html代码

{% load static %}

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.3.7-dist/css/bootstrap.min.css' %}">

    <link rel="stylesheet" href="{% static 'plugins/bootstrap-sweetalert-master/dist/sweetalert.css' %}">

</head>

<body>

    <div class="container">

        <h1>书籍展示</h1>

        <div class="row">

            <div class="col-md-9 col-md-offset-2">

                <a href="/add_book/" class="btn btn-primary">添加书籍</a>

{#                <a href="{% url 'add_book'%}" class="btn btn-primary">添加书籍</a>#}

{#                <a href="{% url 'add_book' 2020 12%}" class="btn btn-primary">添加书籍</a>#}

                <table style="margin-top: 10px;" class="table table-bordered table-striped table-hover">

                    <thead>

                    <tr>

                        <th>编号</th>

                        <th>书籍名称</th>

                        <th>价格</th>

                        <th>出版日期</th>

                        <th>出版社</th>

                        <th>作者</th>

                        <th>操作</th>

                    </tr>

                    </thead>

                    <tbody>

                    {% for book in books %}

                    <tr>

                        <td>{{ forloop.counter }}</td>

                        <td>{{ book.title }}</td>

                        <td>{{ book.price }}</td>

                        <td>{{ book.pub_date|date:'Y-m-d' }}</td>

                        <td>{{ book.pub.name }}</td>

                        <td>{% for j in book.authors.values %}

                            {{ j.name }}

                        {% endfor %}

                        </td>

                        <td>

                            <a href="{% url 'edit_book' book.id %}" class="btn btn-warning">编辑</a>

                            <a href="{% url 'delete_book'  book.pk %}" class="btn btn-danger">删除</a>

                            <span style="display: none;">{{ book.pk }}</span>  //隐藏了一个标签用于获取需要请求删除的id值

                            <a class="btn btn-success del">ajax删除</a>

                        </td>

                    </tr>

                    {% endfor %}

                    </tbody>

                </table>

            </div>

        </div>

    </div>

</body>

<script src="{% static 'js/jquery.js' %}"></script>

<script src="{% static 'plugins/bootstrap-3.3.7-dist/js/bootstrap.min.js' %}"></script>

<script src="{% static 'plugins/bootstrap-sweetalert-master/dist/sweetalert.min.js' %}"></script>

<script>

    $('.del').on('click',function(){

        var delete_id = $(this).prev().text();//找这个点击标签的上一个标签

        var ths = $(this); //用于在下面函数中使用这个点击标签

        swal({

            title: "are you sure?",

            text: "要谨慎！",

            type: "warning",

            showCancelButton: true,

            confirmButtonClass: "btn-danger",

            confirmButtonText: "确定删除",

            cancelButtonText: "容我三思",

            closeOnConfirm: false

        },

        //点击确认删除时触发的函数

            function(){

                $.ajax({

                    url:'/ajax_delete_book/'+ delete_id +'/',

                    //url:'/ajax_delete_book/'+ '100' +'/', //这个是用于演示错误响应error那个回调函数。

                    type:'get',

                    success:function (res) {

                        if (res==='ok'){

                            //关闭弹框

                            swal('删除成功!','你可以跑路了','success');

                            //局部刷新，删除对应记录

                            ths.parent().parent().remove();

                        }else{

                              console.log('出错啦');

                         },

                    error:function(res){

                        if (res.status===404){

                              swal('删除失败!',res.responseText,'error');

                              }

                        }

                    }

                })

            }

        )

    })

</script>

</html>

urls.py文件

urlpatterns = [

    url(r'^ajax_delete_book/(\d+)/', views.ajax_delete_book, name='ajax_delete_book'),

]

views.py文件

def ajax_delete_book(request,pk):

    try:

        models.Book.objects.get(pk=pk).delete()

    except:

        return HttpResponse('找不到对应的资源~~',status=404)

    return HttpResponse('ok')

图书管理系统---基于ajax删除数据的更多相关文章

Vue.js——基于$.ajax实现数据的跨域增删查改
概述之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...
基于ajax提交数据
昨日回顾: 1 inclusion_tag -干什么用的?生成html的片段(动态,传参数,传数据) -app下新建一个模块,templatetags -创建一个py文件(mytag.py) -fro ...
Vue.js——基于$.ajax实现数据的跨域增删查改
转自:https://www.cnblogs.com/keepfool/p/5648674.html 概述之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是loc ...
一般删除网页数据和jquery下使用Ajax删除数据的区别
1. 一般删除网页数据就是指用户在点击删除的时候,会跳转到DeleteUser.ashx一般处理程序中,并且通过get传参的方式传递一个id的参数,然后在后台处理 <a href='Delet ...
MVC使用jQuery.ajax()删除数据
jQuery.ajax()可以简写为$.ajax().以前有写过MVC删除的实现,如<MVC实现删除数据库记录> http://www.cnblogs.com/insus/p/336804 ...
ajax删除数据（不跳转页面）
以前我们讲的删除是利用嵌入php代码,跳转到另一个页面,从而降低了删除速度,但我们今天讲的利用ajax不仅可以达到不跳页面快速删除,并且能添加特效来美化页面. AJAX = 异步 JavaScript ...
图书管理系统基于form组件
models: from django.db import models # Create your models here. class Book(models.Model): name = mod ...
AJAX 删除数据
var json = { "id":"12", "name":"admin"}$.ajax({ type: " ...
ajax 删除数据无刷新
//html页面 <!doctype html><head> <title></title> <meta http-equiv="Con ...
laravel5.4中ajax删除数据
1 JS代码 function deleteInfo(id) { if(id) { var r=confirm('确定要删除吗'); if(r==true) { $.ajax({ url: " ...

随机推荐

[转帖]实战瓶颈定位-我的MySQL为什么压不上去
https://plantegg.github.io/2023/06/20/%E5%AE%9E%E6%88%98%E7%93%B6%E9%A2%88%E5%AE%9A%E4%BD%8D-%E6%88% ...
[转帖]Redis 核心篇：唯快不破的秘密
文章系转载,方便整理和归纳,源文地址:https://z.itpub.net/article/detail/4B5A03BDDBE9A2BC3E080E278FE4D21E 以下文章来源于码哥字节 , ...
Mygin实现中间件Middleware
本篇是mygin的第六篇,参照gin框架,感兴趣的可以从 Mygin第一篇开始看,Mygin从零开始完全手写,在实现的同时,带你一窥gin框架的核心原理实现. 目的实现中间件Middleware ...
C语言输出键盘
使用printf()函数输出样式 #include <stdio.h> int main() { printf("┌───┬───┬───┬───┬───┬───┬───┬─── ...
C#使用命令行打开diskpart修改盘符
参考链接: https://www.cnblogs.com/k98091518/p/6019296.html https://learn.microsoft.com/zh-cn/windows-ser ...
Flask 框架实现自定义分页
手撸的表格分页: Flask框架下的分页,我研究了很久,自带的分页方法不稳定,还不如自己手撸的好使.  <!DOCTYPE html> ...
C/C++ 使用CRC检测内存映像完整性
前面的那一篇文章中所使用的技术只能有效抵抗解密者直接修改硬盘文件,当我们使用动态补丁的时候,那么内存中同样不存在校验效果,也就无法抵御对方动态修改机器码了,为了防止解密者直接对内存打补丁,我们需要在硬 ...
201871010111-刘佳华实验三结对项目—《D{0-1}KP 实例数据集算法实验平台》项目报告
实验三软件工程结对项目 ========== 时间:2021-4-1 项目内容课程班级博客链接课程链接这个作业要求链接作业要求我的课程学习目标 1.了解软件工程过程中结对项目的开发流程 ...
（C语言）我的第一个项目：命令行窗口下的学生成绩管理系统，及数据生成程序
学生成绩管理系统页面效果如图: 代码如下: #include <stdio.h> #include <stdlib.h> #include <string.h> ...
分享实用小工具：JAVA版本位运算工具类
将二进制数中的每位数字1或0代表着某种开关标记,1为是,0为否,则一个数字可以代表N位的开关标记值,可有效减少过多的变量定义或过多的表字段,同时也能在一些复杂的组合判断场景下利用位与.位或.异或等 ...

图书管理系统---基于ajax删除数据

book_list.html代码

图书管理系统---基于ajax删除数据的更多相关文章

随机推荐

热门专题