在CodeIgniter中为DataTables添加编辑删除按钮的实现咨询

我之前在CodeIgniter里给DataTables加编辑删除按钮的时候也踩过几个坑，给你分享一下完整的实现方案，分后端和前端两部分来做：

首先要在控制器里给每条数据添加操作列，然后组装成DataTables要求的JSON格式返回。

1. 完善控制器的dataa方法 #

public function dataa() {
    $draw = intval($this->input->get("draw"));
    $start = intval($this->input->get("start"));
    $length = intval($this->input->get("length"));
    
    $this->load->model('mymodel');
    // 获取分页+过滤后的数据、总记录数、过滤后记录数
    $filtered_data = $this->mymodel->get_filtered_data($start, $length);
    $total_records = $this->mymodel->get_total_records();
    $filtered_count = $this->mymodel->get_filtered_count();
    
    // 遍历数据，添加操作列（编辑+删除按钮）
    foreach ($filtered_data as &$row) {
        // 编辑按钮：跳转到编辑页面，携带记录ID
        $edit_btn = '<a href="' . base_url('your_controller/edit/' . $row['id']) . '" class="btn btn-sm btn-primary">编辑</a>';
        // 删除按钮：绑定AJAX删除事件，携带ID和CSRF令牌（避免跨站请求伪造）
        $delete_btn = '<button class="btn btn-sm btn-danger delete-btn" data-id="' . $row['id'] . '" data-csrf="' . $this->security->get_csrf_hash() . '">删除</button>';
        // 组合两个按钮作为操作列内容
        $row['action'] = $edit_btn . ' ' . $delete_btn;
    }
    
    // 组装DataTables需要的响应格式
    $output = [
        "draw" => $draw,
        "recordsTotal" => $total_records,
        "recordsFiltered" => $filtered_count,
        "data" => $filtered_data
    ];
    
    echo json_encode($output);
    exit;
}

// 新增删除处理方法
public function delete_record() {
    // 验证请求合法性
    if (!$this->input->is_ajax_request() || !$this->input->post('id')) {
        echo json_encode(['status' => 'error', 'msg' => '非法请求']);
        exit;
    }
    
    $record_id = intval($this->input->post('id'));
    // 这里可以添加权限校验逻辑（比如只有管理员能删除）
    
    $delete_success = $this->mymodel->delete_record($record_id);
    if ($delete_success) {
        echo json_encode(['status' => 'success', 'msg' => '删除成功']);
    } else {
        echo json_encode(['status' => 'error', 'msg' => '删除失败']);
    }
}

2. 模型补充对应方法 #

需要在mymodel里实现数据查询、统计和删除的方法：

// 获取分页+过滤后的数据
public function get_filtered_data($start, $length) {
    $search_key = $this->input->get("search")["value"];
    
    $this->db->select('*');
    $this->db->from('your_table_name');
    
    // 处理搜索过滤
    if (!empty($search_key)) {
        $this->db->like('column1', $search_key);
        $this->db->or_like('column2', $search_key);
        // 按需添加更多搜索字段
    }
    
    $this->db->limit($length, $start);
    return $this->db->get()->result_array();
}

// 获取总记录数
public function get_total_records() {
    return $this->db->count_all('your_table_name');
}

// 获取过滤后的记录数
public function get_filtered_count() {
    $search_key = $this->input->get("search")["value"];
    
    $this->db->select('*');
    $this->db->from('your_table_name');
    
    if (!empty($search_key)) {
        $this->db->like('column1', $search_key);
        $this->db->or_like('column2', $search_key);
    }
    
    return $this->db->count_all_results();
}

// 删除单条记录
public function delete_record($id) {
    $this->db->where('id', $id);
    return $this->db->delete('your_table_name');
}

在页面里初始化DataTables，并给删除按钮绑定AJAX事件：

<!-- 数据表格容器 -->
<table id="dataTable" class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>字段1</th>
            <th>字段2</th>
            <!-- 按需添加其他表头 -->
            <th>操作</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

<!-- 引入jQuery和DataTables（如果页面没引入的话） -->
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css">

<script>
$(document).ready(function() {
    // 初始化DataTables
    var dataTable = $('#dataTable').DataTable({
        processing: true,
        serverSide: true,
        ajax: '<?php echo base_url("your_controller/dataa"); ?>',
        columns: [
            { data: 'column1' },
            { data: 'column2' },
            // 对应后端返回的其他字段
            { data: 'action', orderable: false, searchable: false } // 操作列不参与排序和搜索
        ]
    });

    // 绑定删除按钮点击事件
    $(document).on('click', '.delete-btn', function() {
        var recordId = $(this).data('id');
        var csrfToken = $(this).data('csrf');
        var csrfName = '<?php echo $this->security->get_csrf_token_name(); ?>';

        if (confirm('确定要删除这条记录吗？')) {
            $.ajax({
                url: '<?php echo base_url("your_controller/delete_record"); ?>',
                type: 'POST',
                data: {
                    id: recordId,
                    [csrfName]: csrfToken
                },
                success: function(res) {
                    alert(res.msg);
                    if (res.status === 'success') {
                        // 刷新表格数据
                        dataTable.ajax.reload();
                    }
                },
                error: function() {
                    alert('请求失败，请稍后重试');
                }
            });
        }
    });
});
</script>

• CSRF保护：CodeIgniter默认开启CSRF保护，所以AJAX请求必须携带CSRF令牌，否则会被拦截。上面的代码已经处理了这一点。
• 权限校验：在删除方法里一定要添加权限校验逻辑，避免任意用户删除数据。
• 路径配置：确保config.php里的base_url配置正确，否则跳转和AJAX请求会出错。
• 自定义样式：按钮的样式可以根据项目需求替换成自定义的CSS类，不一定用Bootstrap的样式。

内容的提问来源于stack exchange，提问作者Qadeer Malik