jquery datatables列呈现：多个Ajax调用

Question

以下代码位于DataTables表初始化的ColumnDefs部分。在FireBug中，我注意到每列调用我的ColdFusion CFC两次 - 这是低效的。请注意以下代码基于：Data table column rendering with ajax response。

更新1以下是大部分代码 - 注意，并非所有列及其渲染都出现在此代码中。 https://docs.google.com/document/d/1t9vERsngpporbrU-FbE9esjt-KHL0qjLK076qkldGZ8/edit?usp=sharing

{
    "targets": 11, /* Date Created */
     "render": function (data, type, row, meta) { 
      var currentCell = $("#table_main_admin").DataTable().cells({"row":meta.row, "column":meta.col}).nodes(0);
           $.ajax({ 
            url: 'date_conversions.cfc',  
            dataType: 'json',
            data: {method: 'format_date_via_coldfusion', date_input: data}, 
            }).done(function (success) { $(currentCell).html(success.mydate); });
            return null;
          }  
}

Answer 1

为什么要进行重复通话？

因为为所有请求类型调用了渲染回调 - 即display，filter，sort和type。在你的情况下，它最初每行调用两次

• 一次为display，即检索数据
• filter第二次，因为你在列上有一个订单，至少是默认订单

显然，除了第一个AJAX请求之外的任何内容都是多余的。通常你可以通过测试type来避免连续请求，但你有一个AJAX设置，其中应该延迟注入值。

通过DOM插入success.mydate上面的解决方案实际上是更糟糕的部分：它将永远不会工作，因为在下一次抽奖时会忘记任何值。你不能简单地返回success.mydate（经典异步问题）

我建议你在meta.settings.aoColumns[]中维护一个已处理（ajaxed）值的列表（这样你可以在同一个表中有多个具有该设置的列）。

• 如第一个答案所述，检查type是否是善良的display;这是第一个请求，也是您想要/需要处理的唯一请求。
• 然后检查你是否已经处理了该行的列，如果没有处理ajax的东西，并且在done()中通过API更新处理后的值和单元格！
• 同时返回一个虚拟字符串或者可能是data的初始值。
• 在所有其他情况下，从meta.settings.aoColumns[]返回已处理的值

我无法准确复制您的设置，但这是方案：

render: function(data, type, row, meta) {
  if (!meta.settings.aoColumns[meta.col]._processed) {
    meta.settings.aoColumns[meta.col]._processed = []
  }  
  var processed = meta.settings.aoColumns[meta.col]._processed 
  if (type == 'display') {
    if (!processed[meta.row]) {
      processed[meta.row] = 'waiting ...' + meta.row

      $.ajax({
        url : 'https://api.myjson.com/bins/avxod'
      }).done(function(success) {
        var fakeVal = 'Ok, done '+meta.row //success.mydate
        processed[meta.row] = fakeVal

        //update through the API 
        $('#example')
          .DataTable()
          .cell({ row: meta.row, column: meta.col })
          .data( fakeVal )
          .invalidate()

      })
      return processed[meta.row]
    } else {
      return processed[meta.row]
    }
  } else {
    return processed[meta.row]
  }   
}

我相信这是非常失败的证据。这是一个演示 - > http://jsfiddle.net/0bsbw6gt/