javascript - DataTables 使用列选项延迟加载

Question

我正在使用 jQuery DataTables 的服务器端处理模式 ("serverSide": true)。我正在使用deferred loading option优化我的页面加载时间。

我也使用了columns选项，但是当我自己定义columns选项时存在一些冲突。当第一次调用没有数据源时，它会尝试寻找数据源，这就是延迟加载的全部意义。

Uncaught Error: DataTables warning: table id=table - Requested unknown parameter 'id' for row 0. For more information about this error, please see http://datatables.net/tn/4

初始化代码:

function initialize_table(inital_length)
{
    table_options = {
        "serverSide": true,
        "ajax": {
            "url": '/merchant/all/',
            "type": 'POST',
            "deferRender": true,
            // data: JSON.stringify(data),
            // contentType: "application/json",
        },
        // "order": [[0, 'asc']]
        "deferRender": true,
        "processing": true,
        "pageLength": 50,
        "deferLoading": inital_length,
        "lengthMenu": [ 20, 50, 100, 200, 500 ],
        "columnDefs": [
            {
                // "class": "details-control",
                'data': 'gr_id', // response[data]
                'name': 'gr_id', 
                'orderable': true,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 0,
            },
            { 
                'data': "name",
                'name': 'name',
                'orderable': true,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 1,

            },
            { 
                'data': "address",
                'name': 'address',
                'orderable': false,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 2,
            },
            {
                'data': "category",
                'name': 'category',
                'orderable': true,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 3,
            },
            {
                'data': "chain",
                'name': 'chain',
                'orderable': true,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 4,
            },
            {
                'data': "enabled",
                'name': 'enabled',
                'orderable': true,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 5,
            },
            {
                'data': 'status',
                'name': 'status',
                'orderable': true,
                'search': {'regex': false, 'value': ''},
                'searchable': true,
                "targets": 6,
            }
        ],
    }
    var merchant_table = $("#merchant-table").DataTable(table_options);
}

Answer 1

将deferLoading选项与column.data一起使用的错误是once reported在数据表论坛中。我能够使用 v1.10.2 from CDN 重现该错误，但不再使用 v1.10.3 及以上版本，因此我们可以说这个问题已得到修复。这可能已由 new feature 修复。 “能够将 columns.data 与 DOM 源数据结合使用，将行信息读入对象而不是数组”。

所以你可以:

1) 首先确保您使用的是 latest version .

2) 检查您的 JSON 响应。根据您的评论，您正在使用 array data source type ，但是当您设置column.data时选项，您必须使用object data source type相反。