Question

我正在尝试使用dataTable (datatables.net)中的自定义按钮删除所选行。我试图遵循文档，但有一些我不明白的东西。我做的是在确认弹出窗口中单击Approve后，我执行文档rows().remove()上给出的代码，但没有任何反应。

这是我的代码：

<script>
    $(function () {
        var dataSet = [
                        [
                            "<div class='pull-right'>" +
                            "<br />" +
                            "<button type='button' class='btn btn-success' id='Approve' onclick='Approve(1)'> APPROVE </button> &nbsp;" +
                            "<button type='button' class='btn btn-danger' id='Decline' onclick='Decline(1)' > DECLINE </button>" +
                            "</div>" 
                        ]
                      ]

        $('#AccomplishmentTable').dataTable({
            data: dataSet,
            columns: [
                { title: "Employee" }
            ]
        });
    });
</script>

事件我正在尝试执行：

<script>
    $('#AccomplishmentTable tbody').on('click', '#Approve', function () {
        swal({
        title: "Approve this Accomplishment?",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#5cb85c",
        confirmButtonText: "Approve",
        closeOnConfirm: true,
        closeOnCancel: true
        },
        function (isConfirm) {
            if (isConfirm) {
                var url = "@Url.Action("Approve", "Utilities")";
                // $.get(url, { id: id }, function (e) {
                //     swal(e.MTitle, e.MBody, e.MType);
                // });
                console.log("Check");
                var table = $('#AccomplishmentTable').DataTable();
                    table
                    .row($(this).parents('tr'))
                    .remove()
                    .draw();
            } 
        });
    });
</script>

修改我正在使用ASP.NET MVC，这是我的代码的UI，以避免混淆

Answer 1

你有一个简单的范围问题，this指的是嵌入式确认函数（或它是什么），而不是外部事件处理程序。这样做：

$('#AccomplishmentTable tbody').on('click', '#Approve', function () {
  var row = $(this).closest('tr');
  var api = $('#AccomplishmentTable').DataTable();

    swal({
    title: "Approve this Accomplishment?",
    type: "warning",
    showCancelButton: true,
    confirmButtonColor: "#5cb85c",
    confirmButtonText: "Approve",
    closeOnConfirm: true,
    closeOnCancel: true
    },
    function (isConfirm) {
        if (isConfirm) {
            var url = "@Url.Action("Approve", "Utilities")";
            // $.get(url, { id: id }, function (e) {
            //     swal(e.MTitle, e.MBody, e.MType);
            // });
            console.log("Check");
            api.row(row).remove().draw();
        } 
    });
});

Answer 2

我遇到了类似的问题，并尝试了一些例子，但最好的方法是找到here。

我修改了一些东西，对我有用

A:C

使用自定义按钮

2 个答案: