时间戳

首页 > 解决方案 > jQuery 数据表通用 ajax 调用

javascript - jQuery 数据表通用 ajax 调用

问题描述

我正在使用带有以下代码的 jQuery 数据表：

$table.DataTable({
    lengthMenu: [10, 25, 50, 100],
    processing: true,
    paging: true,
    ajax: {
        type: "GET",
        url: '',
        data: function(d) {

        },
        dataSrc: function(json) {
            //some logic
            return json.items;
        },
        error: function(jqXHR) {
           
        }
    },
    "columns": [//my columns]
});

我想要的是使 ajax 请求通用，如下所示：

$table.DataTable({
    lengthMenu: [10, 25, 50, 100],
    processing: true,
    paging: true,
    ajax: ajaxForDataTable(url, methodType, function (d) { }, dataSrcCallback),
    "columns": [//my columns]
});

function ajaxForDataTable(url, methodType, dataCallback, dataSrcCallback) {
    $.ajax({
        type: methodType,
        url: baseUrl + url,
        data: dataCallback,
        dataSrc: dataSrcCallback,
        error: function (jqXHR) {}
    });
}

function dataSrcCallback() {
}

上面的代码工作正常并从服务器获得响应，但dataSrcCallback从未调用（我正在操作数据的地方），因此数据表永远不会填充数据（空）。当我在多个页面上使用此表时，如果我更改任何逻辑，我必须在所有页面上执行此操作。谁能告诉我我在这里做错了什么，以便我可以纠正它并使它对我有用？

标签： javascriptjquerydatatables

解决方案

看看文档：https ://datatables.net/reference/option/ajax 。

您假设将一个函数传递给 ajax 参数并使用要传递给数据表的数据调用回调方法。

$('#example').dataTable( {
  "ajax": function (data, callback, settings) {
    callback(
      JSON.parse( localStorage.getItem('dataTablesData') )
    );
  }
} );

推荐阅读