javascript - 我无法使用数据表 jquery 显示 aaData 的总计值

Question

访问“fnFooterCallback”中的 aaData 值时遇到问题。

这是日志的输出:

aaData: [object Object],[object Object],[object Object],[object Object]

确实，我有 4 行要在数据表中显示，但我无法访问这些值以在数据集中显示总计。

我尝试使用这个:

"fnDrawCallback": function(oSettings) {
     console.log("aaData: "+oSettings.aoData ); 
     iTotal = [0, 0];
     for (var i = 0; i < oSettings.aoData.length; i++) {
         iTotal[0] += oSettings.aoData[i]._aData.quantity;
     }

    //Totales
     $("#Totales").empty();
     $("#Totales").append('<th>sum</th><th>'+iTotal[0]+'</th>');
}

我也尝试这样做:

"fnFooterCallback" : function(nRow, aaData, iStart, iEnd, aiDisplay) {
    console.log("aaData: " + aaData);
    var totalCantidad = 0;
    for ( var i = 0; i < aaData.length; i++) {
        totalCantidad = totalCantidad+ parseInt(aaData[i].Cantidad) * 1;
    }
    var nCells = nRow.getElementsByTagName('th');
    nCells[1].innerHTML = totalCantidad;
}

这是我对数据表的定义:

$("#lineOutletTable").dataTable({
    "bInfo" : false,
    "bPaginate" : false,
    "bLengthChange" : true,
    "iDisplayLength" : -1,
    "bFilter" : false,
    "bSort" : true,
    "aaSorting" : [ [ 0, "asc" ] ],
    "bAutoWidth" : false,
    "oLanguage" : spanishInfo,
    "aoColumns" : columnsTableLine,
    "sPaginationType" : "bootstrap",
    "iDisplayStart" : 20,
    "sScrollY" : "60px",
    "sDom" : "<row-fluid'<'span6 wrapMedidasReales'><'span6 wrapPrecios'>>t<row-fluid'<'span6 'l><'span6'p>>",
    "fnDrawCallback" : function(oSettings) {
        console.log("aaData: " + oSettings.aoData);
        iTotal = [ 0, 0 ];
        for ( var i = 0; i < oSettings.aoData.length; i++) {
            iTotal[0] += oSettings.aoData[i]._aData.quantity;
        }
        // Totales
        $("#Totales").empty();
        $("#Totales").append('<th>sum</th><th>' + iTotal[0] + '</th>');
    },
    "fnFooterCallback" : function(nRow, aaData, iStart, iEnd, aiDisplay) {
        console.log("aaData: " + aaData);
        var totalCantidad = 0;
        for ( var i = 0; i < aaData.length; i++) {
            totalCantidad = totalCantidad + parseInt(aaData[i].Cantidad) * 1;
        }
        var nCells = nRow.getElementsByTagName('th');
        nCells[1].innerHTML = totalCantidad;
    }
});

我从 Ajax 读取了值，除了总计之外，数据集工作正常。

如何访问 aaData 中的值？

Answer 1

很难理解你到底想要做什么，因为你没有包含表格的 html 部分和 ajax 调用的结果。所以我不知道您想在哪里显示总计。

看一下这段代码:

$(function() {
  totals = 0;
  var otable = $("#datatable").dataTable({
    "fnFooterCallback": function(nRow, aaData, iStart,
      iEnd, aiDisplay) {
      x = aaData;
      $.each(x, function(key, value) {
        totals = totals + parseInt(value[1]);
      })
      $("#Totales").empty();
      $("#Totales").append('Totals: ' + totals);

    }
  });
});

还有这个Plunker

这至少应该给你一个关于如何访问 aaData 的提示。也许使用 plunker 作为基础并填写您已完成的定义。这样我们就有了一个更好的起点。