在 jQuery 中，我可以在 Ajax 函数之后使用 DataTables 插件吗？答案

【问题标题】：In jQuery, can I use DataTables plugin after the Ajax function?在 jQuery 中，我可以在 Ajax 函数之后使用 DataTables 插件吗？
【发布时间】：2018-04-05 13:49:30
【问题描述】：

如果我尝试重新加载我的数据表，则不会进行任何更改。

$.ajax({
    url: '../CustomJS/Service.asmx/GetCustomer',
    method: 'POST',
    dataType: 'json',
    success: function (data) {
    $('#dataTable').dataTable({
            data: data,
            sorting: true,
            searching : true,
            columns: [
                {
                    'data': 'CustomerID',
                    'sortable': false,
                    'searchable':false,
                    "render": function (id) {
                        return '<input type="checkbox" name="custSelect" data-columnIndex="'+id+'"/>'
                    }
                },
                {'data':'CustomerID'},
                {'data':'CustomerName'},
                {'data':'CustomerMobile'},
                {'data':'City'},
                {'data': 'Email' },
                {
                    'sortable': false,
                    'searchable': false,
                    'data': function (data, type, dataToSet) {
                        console.log("data",data)
                        if (data.Status == 1) {
                            return '<i class="far fa-edit update-icon" onclick=Update(' + data.CustomerID + ')></i><i class="fas fa-lock-open unlock-icon" onclick=Status('+data.CustomerID+',' + data.Status + ')></i><i class="fas fa-trash delete-icon" onclick=Delete(' + data.CustomerID + ')></i>';
                        } else {
                            return '<i class="far fa-edit update-icon" onclick=Update(' + data.CustomerID + ')></i><i class="fas fa-lock lock-icon" onclick=Status(' + data.Status + ',' + data.CustomerName + ')></i><i class="fas fa-trash delete-icon" onclick=Update(' + data.CustomerID + ')></i>';
                        }
                    },
                },
                {
                    'data': 'Status',
                    'sortable': false,
                    'searchable': false,
                    "render": function (active) {
                        if (active == 1) {
                            return '<label class="status-active">Active</label>';
                        } else {
                            return '<label class="status-in-active">In-Active</label>';
                        }
                    }
                }
            ]
        });

    },
    error: function (JqXHR, error, exception) {
        console.log("XHR", JqXHR.responseText);
        console.log("error", error);
        console.log("Exception", exception);
    }
});

这里我习惯于重新加载表格，

table.dataTable().ajax.reload();

table.datatable().ajax.api().reload();

$('#dataTable').dataTable().api().reload();

$('#dataTable').DataTable().api().reload();

这些对我不起作用。

【问题讨论】：

标签： jquery ajax datatable

【解决方案1】：

问题是您在 Ajax 成功回调函数中定义了 DataTables - 所以这意味着 DataTables 不知道 Ajax 配置，它只是使用返回的数据进行初始化。

要使用 DataTables 的 ajax.reload() 功能，您需要在 DataTables 初始化中定义 Ajax 配置 - 请查看示例 here。

【讨论】：