将两列与数据表相乘

Question

I want to multiply two columns with datatables . 我想乘两列数据表。 I have my table this way: 我的桌子是这样的：

<table border="5" class="teste1" method="POST" id="table">
<thead>
<tr>
<th class="filter" style="width:42px; text-align: center; font-size: 12px">Quantidade</th>
<th class="filter" style="width:25px; text-align: center; font-size: 12px">Preço</th>
</tr>
</thead>
<tbody>
<tr>
<?php
    while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {
?>
<td style="font-size: 12px"> <?php echo $rows_cursos['Quantidade']; ?></td>
<td style="font-size: 12px"> <?php echo $rows_cursos['Preco']; ?></td>
</tr>
<?php } ?>
</tbody>';
<?php
}
?>
</table>

Then I'm trying to multiply the column of the quantity * price as follows: 然后，我尝试按如下方式乘以quantity * price列：

(function ($) {$(document).ready(function () {
$('#table').dataTable({  
drawCallback: function () {
  var api = this.api();
  $( api.table().footer() ).html(
    api.column( 1 * 2 ).data().sum()
  );
}
});
})(jQuery)

But it is not working, and I want to show the data in a row at the bottom of the table, in the <tfoot> </ tfoot> table. 但这不起作用，我想在表底部的<tfoot> </ tfoot>表中连续显示数据。 I intend that the sum of this multiplication always returns the result according to the filter. 我希望这个乘法的总和总是根据过滤器返回结果。

Answer 1

I assume, you have your HTML prepared by PHP-script (which is not the best available option, in my opinion). 我想，您已经用PHP脚本准备了HTML（我认为这不是最好的选择）。

Howerver, if you have some node within your <tfoot> reserved to display total cost (let it be span#sumproduct , for instance), you may: 但是，如果您在<tfoot>保留了一些节点以显示总成本（例如，将其设为span#sumproduct ），则可以：

get visible ( {search:'applied'} selector modifier) rows source data into array with rows().data() and .toArray() 变得可见（ {search:'applied'}选择器修饰符）行源数据放入具有rows().data()和.toArray()数组中
reduce that array into total cost 将阵列减少到总成本中
refresh span#sumproduct .text() each time you get your footer re-drawn ( footerCallback option): 每次重新绘制页脚时都刷新span#sumproduct .text() （ footerCallback选项）：

 //source data const srcData = [['apple',5,3],['pear',4,2],['banana',3,1]] //datatables initialization $('#example').DataTable({ dom: 'ft', data: srcData, columns: ['item', 'qty', 'price'].map(title => ({title})), footerCallback: function(){ const sumProduct = this .api() .rows({search:'applied'}) .data() .toArray() .reduce((res,[item, qty, price]) => res += qty*price, 0); $('#sumproduct').text(sumProduct); } })

 <!doctype html><html><head><link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/rg-1.1.0/datatables.min.css" /><script type="application/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script><script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/rg-1.1.0/datatables.min.js"></script></head><body><table id="example"><tfoot><tr><td colspan="3">Overall cost is: <span id="sumproduct"></span></td></tr></tfoot></table></body></html>

将两列与数据表相乘

问题描述

1 个解决方案

解决方案1
2 已采纳 2019-07-18 11:16:12

将两列与数据表相乘

问题描述

1 个解决方案

解决方案1 2 已采纳 2019-07-18 11:16:12

解决方案1
2 已采纳 2019-07-18 11:16:12