有没有办法让数据表中的按钮可单击以使用 Ajax 发送数据？

Question

我正在向 API 发送请求，我正在获取所有数据并将其映射到 table，同时为每一行显示一个按钮并附加到按钮来自数据的 ID。问题是当我给按钮一个 ID 让我们说 remove 并创建一个函数来触发按钮点击什么都没有发生甚至没有注册它被点击和下面是代码：

$(document).ready(function () {
    $("#documentsDatatable").DataTable({
        "processing": true,
        "serverSide": true,
        "filter": true,
        "ajax": {
            "url": 'https://localhost:44389/api/Document/Group',
            "type": "POST",
            "data": {id: 90},
            "datatype": "json"
        },
        "columnDefs": [{
            "targets": [0],
            "visible": false,
            "searchable": false
        }],
        "columns": [
            { "data": "name", "name": "Name", "autoWidth": true },
            { "data": "name", "name": "Document", "autoWidth": true },
            {
                data: "created_at",
                "render": function (value) {
                    if (value === null) return "";
                    return moment(value).format('DD/MM/YYYY');
                }
            },
            {
                "render": function (data, type, full, meta) {
                    return "<button value='" + full.id + "' id='remove' class='btn btn-danger'><i class='fas fa-minus-circle'></i> Remove from Group</button>";
                }
            },

        ]
    });
});

这是应该启动的函数：

    $('#remove').on('click', function (e) {
    $.ajax({
        type: 'POST',
        url: "https://localhost:44389/api/Group/Remove",
        data: {id: 4, group: 46},
        dataType: 'json',
        success: function (data) {
            //console.log('success', data);

        },
    });
    e.preventDefault();
});

上面的代码甚至无法启动该功能，但是当我像下面这样创建一个随机按钮并将 ID 替换为该按钮上的 ID 时，代码运行良好。有人知道问题出在哪里吗？

<button id="trial" value="50">Click me</button>

Answer 1

使用类似这样的东西。

---------------------------------------------------------
        "render": function (data, type, full, meta) {
            return `<button onclick=remove( ${full.id}) class='btn btn-danger'><i class='fas fa-minus-circle'></i> Remove from Group</button>`;
        }
---------------------------------------------------------

        function remove (id) {
            $.ajax({
                type: 'POST',
                url: "https://localhost:44389/api/Group/Remove",
                data: { id: id, group: 46 },
                dataType: 'json',
                success: function (data) {
                    //console.log('success', data);

                },
            })
        };
--------------------------------------------------------------

有没有办法让数据表中的按钮可单击以使用 Ajax 发送数据？

Is there a way to make a button inside a Datatable clickable to send data using Ajax?

javascript

ajax