入门PHP就来我这（高级）16 ~ 批量删除功能

冷心笑看丽美人

于 2024-07-08 15:48:09 发布

阅读量175

点赞数 9

分类专栏： PHP学习文章标签： php 开发语言面向对象 PHP基础知识 php基础

本文链接：https://blog.csdn.net/weixin_38298363/article/details/140270354

版权

PHP学习专栏收录该内容

17 篇文章 0 订阅

订阅专栏

有胆量你就来跟着路老师卷起来！ -- 纯干货，技术知识分享

 路老师给大家分享PHP语言的知识了，旨在想让大家入门PHP，并深入了解PHP语言。

本文给大家接着上篇文章进行图书删除功能的优化，实现批量删除图书的功能。

1 添加删除按钮

<div class="panel-heading">
                    图书列表
    <button id="goAdd" style="margin-left: 30px;" class="btn btn-primary btn-sm">
    <i class="fa fa-disk-o"></i>
        新增
     </button>
     <button id="deleteBatch" style="margin-left: 10px;" class="btn btn-danger btn-sm">
      <i class="fa fa-disk-o"></i>
        删除
     </button>
</div>

显示页面如下：

2 表格前面的复选框

效果如下：

其中抽发选择的js逻辑如下：

let rows = new Array();

    document.getElementById('goAdd').addEventListener('click', function() {
            window.location.href = 'add.html'; // 将此处替换为你想要跳转的URL
    });
    document.getElementById('deleteBatch').addEventListener('click', function() {
        console.log("rows:"+rows.length)
        if(rows.length === 0) {
                alert("请选择您要删除的数据！");
                return false;
        }
        var msg = "确认要删除吗？\n\n请确认！";
        if(confirm(msg)===true) {
            console.log("js rows:"+rows)
            var queryString = rows.join(',');
            console.log("queryString:"+queryString)
            // PHP文件的URL
            var deleteBatch = 'deleteBatch.php';
            // 使用fetch API发送请求
            fetch(deleteBatch + '?rowIds=' + queryString,{method:'GET'})
                .then(response => response.text())
                .then(data => console.log(data))
                .catch(error => console.error('Error:', error));    

        } else {
            return false;
        }
        
    });

    $(document).ready(function() {
        $('#selectAll').click(function() {
            $('.selectRow').prop('checked', this.checked);

            var curr = $(this).is(':checked');
            console.log("kskskksk"+curr)
            $('.selectRow').each(function() {
                var currentId = $(this).attr('value');
                var current_checked =$(this).is(':checked');
                console.log(currentId)
                if(current_checked){
                    rows.push(currentId);
                }else{
                    rows.pop(currentId);
                }
                
            });
            
        });
        
        $('.selectRow').click(function() {
            console.log($(this).is(':checked'))
            var current_rowId = $(this).closest('tr').find('.selectRow').val();
            console.log("current_rowId:"+current_rowId);
            if($(this).is(':checked')){
                rows.push(current_rowId);
            } else{
                rows.pop(current_rowId);
            }
            
            if ($('.selectRow:checked').length === $('.selectRow').length) {
                $('#selectAll').prop('checked', true);
            } else {
                $('#selectAll').prop('checked', false);
            }
        });
    });

3 实现php的后端逻辑

<?php  
// 数据库连接参数  
$host = 'localhost';  
$username = 'root';  
$password = 'passwd';  
$dbname = 'db_test';  
  
// 创建连接  
$conn = new mysqli($host, $username, $password, $dbname);  
  
// 检查连接  
if ($conn->connect_error) {  
    die("连接失败: " . $conn->connect_error);  
}  
  
// 假设这是你想要删除的rowIds数组  
$rowIds = $_GET['rowIds'];
  
// 准备SQL语句  
$sql = "DELETE FROM books WHERE id IN ($rowIds)";  
  
// 执行SQL语句  
if ($conn->query($sql) === TRUE) {  
    echo "删除成功！";  
} else {  
    echo "错误: " . $sql . "<br>" . $conn->error;  
}  
  
// 关闭连接  
$conn->close();  
?>