带有甜蜜警报的数据表删除记录不起作用答案

【问题标题】：Datatable delete record with sweetalert dont working带有甜蜜警报的数据表删除记录不起作用
【发布时间】：2019-07-05 05:43:35
【问题描述】：

我正在编写一个 crm 脚本。但我有一个问题。客户在数据表中。我想从数据库和数据表中确认删除。我写了一些代码。并放入foreach。但是代码只在第 1 页有效。我该如何解决？

我在数据表上的按钮：

<form id="mulksilme-<?php echo $mulkid; ?>" method="POST">
    <input type="text" style="display: none;" name="mulkklavus" value="<?php echo $mulkid; ?>">
    <button id="sa-warning" type="submit" class="btn btn-info">
        <i class="ti-trash"> </i>
    </button>
</form>

我的 javascript（为每一行生成此代码）：

$('#myTable').dataTable({
    "drawCallback": function (settings) {
        $("#mulksilme-<?php echo $mulkid; ?>").on("submit", function (e) {
            e.preventDefault();
            Swal.fire({
                title: 'Emin Misiniz?',
                text: "Mülk sonsuza dek silinecektir!",
                type: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Evet, silinsin!',
                cancelButtonText: 'Hayır, vazgeç!'
            }).then((result) => {
                    if (result.value) {
                        $.ajax({
                            url: "sil.php",
                            type: "POST",
                            data: new FormData(this),
                            contentType: false,
                            processData: false,

                        })
                        location.reload();
                    }
                }
            )
        });
    }
});

【问题讨论】：

标签： javascript php html datatable sweetalert2

【解决方案1】：

在这种情况下，从服务器端传递 ID 将不起作用。您必须在客户端获取每行的 ID。

例子

<table id="data-table" class="table table-striped table-bordered dt-responsive nowrap dataTable no-footer dtr-inline collapsed">
    <thead>
    <tr>
        <th>Username</th>
        <th>E-Mail/th>
        <th>First name</th>
        <th>Last name/th>
        <th>Role</th>
        <th>Enabled</th>
        <th>Created at</th>
        <th>Action</th>
    </tr>
    <tfoot></tfoot>
</table>

const table = $('#data-table').DataTable({
    'processing': true,
    'serverSide': true,
    'language': {
        'url': __('js/datatable-english.json')
    },
    'ajax': {
        'url': 'users/list',
        'type': 'POST'
    },
    'columns': [
        {'data': 'username'},
        {'data': 'email'},
        {'data': 'first_name'},
        {'data': 'last_name'},
        {'data': 'role'},
        {'data': 'enabled'},
        {'data': 'created_at'},
        {
            'orderable': false,
            'searchable': false,
            'data': null,
            'render': function (data, type, row, meta) {
                return '<button type="button" class="btn btn-info">Edit</button>';
            }
        }
    ],
});

$('#data-table tbody').on('click', 'button', table, function () {
    const data = table.row($(this).parents('tr')).data();
    //alert('Edit user: ' + data.id);

    Swal.fire({
        title: 'Emin Misiniz?',
        text: "Mülk sonsuza dek silinecektir!",
        type: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Evet, silinsin!',
        cancelButtonText: 'Hayır, vazgeç!'
    }).then(function (result) {
            if (result.value) {
                $.ajax({
                    url: "sil.php",
                    type: "POST",
                    contentType: 'application/json',
                    dataType: 'json',
                    data: JSON.stringify(data)
                }).done(function (result) {
                    alert('done');
                    //location.reload();
                });
            }
        }
    )
});

【讨论】：