Рассчитать сумму значений в нижнем колонтитуле с данными jquery

Question

Я хочу отобразить общую сумму в нижнем колонтитуле с данными jquery. Вот мои данные:

Вот мой код данных JQuery:

for (var i = 0; i < length; i++ ) {
    var patient = data.data[i];
    console.log(patient);

    var formattedDate = function() {
        if (patient.Date === null) return "";
        var pattern = /Date\(([^)]+)\)/;
        var results = pattern.exec(patient.Date);
        var dt = new Date(parseFloat(results[1]));
        return (dt.getMonth() + 1 + "/" + dt.getDate() + "/" + dt.getFullYear());
    }

    $('#myReportTable').dataTable().fnAddData([
        patient.Name,
        patient.Address,
        //patient.Date,
        formattedDate,
        patient.Description,
        patient.Amount
    ]);
}

$('#myReportTable').DataTable({
footerCallback: function (tfoot, data, start, end, display) {
        var api = this.api();
            $(api.column(4).footer()).html(
            "Total: " + api.column(4).data().reduce(function (a, b) {
                return a + b;
            }, 0)
        );
    }
});

Пробовал этот код, но он показывает ошибку:

Я новичок в этом, пожалуйста, помогите.

Answer 1

Вы инициализируете DataTable () как два раза в своем коде. Просто объедините этот код, чтобы он не выдавал ошибку, как вы упомянули (не может повторно инициализировать данные ...).

$(document).ready(function () {
        $('#example').DataTable({
            "footerCallback": function (row, data, start, end, display) {
                total = this.api()
                    .column(4)
                    .data()
                    .reduce(function (a, b) {
                        return parseInt(a) + parseInt(b);
                    }, 0);
                alert(total);
            }
        }).fnAddData([
                patient.Name,
                patient.Address,
                //patient.Date,
                formattedDate,
                patient.Description,
                patient.Amount
            ]);
    });

Answer 2

Вы можете использовать таблицы данных Сумма API

ссылка - https://datatables.net/plug-ins/api/sum()

Также вы можете использовать функцию drawcallback вместе с api суммы вычислять некоторые при каждом добавлении записи.

в принципе как то так ;

$('#myReportTable').DataTable( {
    drawCallback: function () {
      var api = this.api();
      $( api.table().footer() ).html(
        api.column(3).data().sum()
      );
    }
  } );

3-й столбец показывает вашу сумму.