I will need your support to count subtotal and total in html table (without buttons).
Formulas of table:
Subtotal: 1st column * 2nd column (inputs)
Total: Sum of subtotals
<table rowspan="0" id="res">
<table rowspan="0" id="res">
<tr>
<th>Bank</th>
<th>Qty</th>
<th>Subtotal</th>
</tr>
<tr>
<td>5000</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>2000</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>1000</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>500</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>200</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>100</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>50</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>20</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>10</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>5</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>2</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td>1</td>
<td><input type="text"></td>
<td></td>
</tr>
<tr>
<td colspan="3"></td>
</tr>
<tr>
<td>Total</td>
<td></td>
<td>CZK</td>
</tr>
</table>
https://jsfiddle.net/Lm6mf95z/
E.G. screen of example:
This would be a start for you.
firstly, you dont't need that part in your table:
<tr>
<td colspan="3"></td>
</tr>
your can add this jQuery to execute the inner function for every event change
that occurs to an input
field of your page:
jQuery(document).on('change', 'input', function() {
var total = .0;
$('#res tr:not(:first)').each(function(i,item){
var tds = $(item).find('td');
var celQty = $(tds[1]);
var inputQty = $(celQty.find('input')[0]);
var qty = parseFloat(inputQty.val());
if($(tds[0]).text() == "Total"){
$(tds[1]).text(total);
}else {
var bankColValue = parseFloat($(tds[0]).text());
var colSubTotal = $(tds[2]);
var valItem = bankColValue * (isNaN(qty)? 0: qty);
colSubTotal.text(valItem);
total += valItem;
}
});
});
Follow the Fiddle updated.
Hope it helps.