在数据表上显示列的总和（总计）并导出到 excel

Question

我正在将数据表导出为 4 列的 excel 文件，其中我的第 3 列包含产品价格，现在导出后，我应该在表末尾看到一个带有“总计”的附加行并包含总和第 3 列的值。

我曾想过使用 footercallback 在数据表上显示它并直接导出数据表，但由于我在页脚部分使用了多重过滤器并且无法再创建一个页脚，所以这个想法行不通。

期望：在数据表附近的 html 页面上显示第 3 列（已过滤）的总和，说明当我导出为 excel 时，它应该在表格行的末尾包含总和值。

Answer 1

你可以这样做：

    var len=$("tr").length;

    var sum=0;

    for(var i=1;i<len;i++){
      sum += parseFloat($("tr td").eq(2).html());
    }

    $("table").createElement("<tr><td></td><td></td><td>"+sum+"</td></tr>");

Answer 2

据我了解，您需要每种产品的所有价格的总和。您可以将总计作为数据表中的隐藏列。当您执行 excel 导出时，它将显示总计。这是示例 html 和 javascript 代码。希望这对您有所帮助。

HTML

<table class="table display" id="table2" >
        <thead>
            <tr>
                <th>Product</th>
                <th>Price </th>
                <th>Tax</th>
                <th>Shipping Charges</th>
                <th>Total</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th>Product1</th>
                <td>100</td>
                <td>20</td>
                <td>12</td>
                <td>132</td>
            </tr>
            <tr>
                <th>Product2</th>
                <td>234</td>
                <td>34</td>
                <td>32</td>
                <td>300</td>
            </tr>
            <tr>
                <th>Product3</th>
                <td>543</td>
                <td>23</td>
                <td>54</td>
                <td>620</td>
            </tr>

        </tbody>
    </table>

Javascript

  $('#table2').dataTable({


            dom: 'Bfrtip',
            "columnDefs": [

            {
                "targets": [ 4 ],
                "visible": false
            }
        ],
            buttons: [{
                extend: 'excel',
                filename : 'test',

            }]
        });