1

Pretendo multiplicar duas colunas com datatables. Tenho a minha tabela desta forma:

<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>

Depois estou a tentar multiplicar a coluna da quantidade * preço da seguinte forma:

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

Mas não está a funcionar, e pretendo mostrar os dados numa linha no fundo da tabela, no <tfoot></tfoot> da tabela. Pretendo que a soma dessa multiplicação retorna sempre o resultado conforme o filtro que faço na tabela com o datatables

1 Resposta 1

1

Resolvi o problema desta forma:

Defeni na coluna onde pretendo mostrar o resultado dentro do <tfoot></tfoot>:

<tfoot>
<tr>
<td colspan="9" align="Right">Valor Total: <span id="sumproduct"></span>€</td>
</tr>
</tfoot>

Depois no js fiz da seguinte forma:

$('#table').dataTable({  
  footerCallback: function(){
   const sumProduct = this
      .api()
      .rows({search:'applied'})
      .data()
      .toArray()
      .reduce((res,row) => {const Quantidade = row[4], Preco = row[8]; return res += Quantidade*Preco},0);
    $('#sumproduct').text(sumProduct);
    }
})

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .