延迟加载和自定义渲染答案

【问题标题】：Deferred loading and custom rendering延迟加载和自定义渲染
【发布时间】：2015-08-11 14:14:21
【问题描述】：

我有一个使用服务器端处理的数据表。像这样的：

var table = $('#example').dataTable( {
    "processing": true,
    "serverSide": true,
    "deferLoading": 50,
    "columnDefs": [
        {
            "name": "a.edit",
            "targets": 3,
            "render": function ( data, type, full, meta ) {
                return '<a class="btn btn-info" data-sid="'+data.id+'" href="'+data.url+'">Edit</a>';
            }
        }
    ]
});

如您所见，我的第三列是链接/按钮，而不是原始文本。我从处理脚本返回的数据中接收 ID 和 URL 变量。

我的问题是我想绘制模板内置表格的初始页面，而不是使用 AJAX 请求加载它（就像this） - 这就是我使用deferLoading 选项的原因。第 3 列中的按钮是在我的模板中预先构建的。但是因为我使用了渲染选项，所以我在这些列中的 HTML 代码会被我在渲染选项中编写的代码覆盖。而且，由于我的初始模板中没有从 AJAX 请求返回的数据变量，它们只是获得了一个 undefined 值。

我想要的是让我的初始页面中的列“不受渲染”选项的影响 - 并且只将该渲染参数应用于来自 AJAX 请求的数据（2-3-N 个页面）。

【问题讨论】：

标签： jquery ajax datatables

【解决方案1】：

仅当 data.id 不是 undefined 时，即在成功的 AJAX 请求之后，尝试使用此代码而不是 render。

var table = $('#example').dataTable( {
    "processing": true,
    "serverSide": true,
    "deferLoading": 50,
    "columnDefs": [
        {
            "name": "a.edit",
            "targets": 3,
            "render": function ( data, type, full, meta ){
                if(typeof data.id !== 'undefined'){
                    data = '<a class="btn btn-info" data-sid="'+data.id+'" href="'+data.url+'">Edit</a>';
                }

                return data;
            }
        }
    ]
});

【讨论】：