DataTables вычисляет итоговое значение столбца на основе другого значения

Question

Использование Datatables 1.10.19

В моей таблице пять столбцов, column 2 содержит цены, column 5 содержит строку. Я хочу вычислить сумму по столбцу 2 , где столбец 5 равен «Наличные» .

Я также хочу выполнить расчет на основе диапазона дат. Как мне этого добиться?

Я попробовал следующее, но это не работает так, как я хочу. Он успешно вычисляет сумму, но не на основе какого-либо фильтра. Он просто суммирует все значения в столбце 2.

$('.date-range-filter').change(function() {

    // get all values in column 2
    var cashTotalData = api.search('Cash').column(2, {
        page: 'all'
    }).data();

    // calculate all values
    var cashTotalValue = cashTotalData.reduce(function(a, b) {
        return intVal(a) + intVal(b);
    }, 0).toFixed(2);

    console.log(cashTotalValue); // this displays the correct total of *all* values in column 2, but not the total based on my date range

    $('#records').DataTable().draw();
});

Любой совет приветствуется.

Answer 1

Я не думаю, что вы хотите .search(), я думаю, что вы хотите .filter(), но я не мог понять, как это сделать. Пример, который я включил ниже, просто перебирает строки и суммирует сумму в долларах.

$(document).ready(function(){
    var table = $("#table").DataTable();
    $('.date-range-filter').click(function() {
        let cashTotalValue = 0;

        table.rows().eq(0).each(function(index){
            var row = table.row( index );
            console.log(row.data());
            // the "type" column is #5, but arrays are 0 based, so subtract one
            if (row.data()[4] == 'Cash') {
                // the "amount" column is #2, but arrays are 0 based, so subtract one
                cashTotalValue += parseInt(row.data()[1]);
            }
        });

        console.log(cashTotalValue.toFixed(2)); // this displays the correct total of *all* values in column 2, but not the total based on my date range
        alert(cashTotalValue.toFixed(2)); // this displays the correct total of *all* values in    
    });
});

<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<table id="table">
    <thead>
        <tr>
            <th>Transaction</th>
            <th>Amount</th>
            <th>Description</th>
            <th>Date</th>
            <th>Type</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>3</td>
            <td>Description</td>
            <td>11/15/2018</td>
            <td>Cash</td>
        </tr>
        <tr>
            <td>2</td>
            <td>5</td>
            <td>Description</td>
            <td>11/15/2018</td>
            <td>Credit</td>
        </tr>
        <tr>
            <td>3</td>
            <td>7</td>
            <td>Description</td>
            <td>11/16/2018</td>
            <td>Cash</td>
        </tr>
        <tr>
            <td>4</td>
            <td>11</td>
            <td>Description</td>
            <td>11/16/2018</td>
            <td>Credit</td>
        </tr>
    </tbody>
</table>
<input type="button" class="date-range-filter" value="Click"/>