I have a datatable with quantity data but I want this autosum when I select a said quantity from the tables. Something very similar to excel SUM
.
$(document).ready( function () {
$('#myTable').DataTable({
select: true
});
} );
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
<link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<table id="myTable" class="table table-bordered">
<thead>
<tr id="EncabDespachos">
<th>Id</th>
<th>Pedido</th>
<th>Cantidad</th>
<th>Real</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td data-name="pedido" class="pedido" data-type="text">001</td>
<td data-name="Cantidad" class="Cantidad" data-type="text">10</td>
<td data-name="Cantidad" class="Cantidad" data-type="text">10</td>
</tr>
<tr>
<td>2</td>
<td data-name="pedido" class="pedido" data-type="text">002</td>
<td data-name="Item" class="Item" data-type="text">20</td>
<td data-name="Cantidad" class="Cantidad" data-type="text">15</td>
</tr>
</tbody>
</table>
<h3>Sumar total<h3/>
<input type="text" class="form-control" value="" name="autosum" autocomplete="off">
I attach a photo. If I select x amounts of Row this should add up to the input below.
I hope I have explained myself well. Cheers
To get what you want you need to know the following about DataTables:
select
.cells()
.data()
.reduce()
.An example of how to do what you want (see comments in the code) is: