I have a problem in jQuery in html. Just need some changes in calculation, below are my codes All result will be calculated in one field as I did
Existing: total = expenses – socso – kwsp
The result i need is: total = expenses – socso – (kwsp / 100 * expenses)
Thank you
<td><input type="hidden" name="txtid[]" value="'.$d["id"].'">
<input type="text" name="txtbasic[]" class="form-control expenses"></td>
<td><input type="text" name="txtallowance[]" class="form-control expenses"></td>
<td><input type="text" name="txtsocso[]" class="form-control socso"></td>
<td><input type="text" name="txtkwsp[]" class="form-control kwsp"></td>
<td><input type="text" name="txttotal[]" class="form-control total"></td>
<script>
$(document).on('keyup', 'input.expenses, input.socso, input.kwsp', function () {
var total = 0;
// Adding txtbasic and txtallowance
$expenses = $(this).parents('tr').find('.expenses');
$.each($expenses, function (index, object) {
var val = parseInt($(object).val())
if(!isNaN(val) && val) {
total += parseInt($(object).val());
}
});
// Adding txtsocso
$socso = $(this).parents('tr').find('.socso');
$.each($socso, function (index, object) {
var val = parseInt($(object).val())
if(!isNaN(val) && val) {
total -= parseInt($(object).val());
}
});
// Adding txtkwsp
$kwsp = $(this).parents('tr').find('.kwsp');
$.each($kwsp, function (index, object) {
var val = parseInt($(object).val())
if(!isNaN(val) && val) {
total -= parseInt($(object).val());
}
});
// Updating the Total
$expenseTotal = $(this).parents('tr').find('.total');
$expenseTotal.val(total)
});
</script>
Advertisement
Answer
As you can see from the example below, instead of use total directly i create for all type a variable then use it for create the mathematical operation
$(document).on('keyup', 'input.expenses, input.socso, input.kwsp', function() {
var total = 0;
$expensesval = 0;
$socsoval = 0;
$kwspval = 0;
// Adding txtbasic and txtallowance
$expenses = $(this).parents('tr').find('.expenses');
$.each($expenses, function(index, object) {
var val = parseInt($(object).val())
if (!isNaN(val) && val) {
$expensesval += parseInt($(object).val());
}
});
// Adding txtsocso
$socso = $(this).parents('tr').find('.socso');
$.each($socso, function(index, object) {
var val = parseInt($(object).val())
if (!isNaN(val) && val) {
$socsoval += parseInt($(object).val());
}
});
// Adding txtkwsp
$kwsp = $(this).parents('tr').find('.kwsp');
$.each($kwsp, function(index, object) {
var val = parseInt($(object).val())
if (!isNaN(val) && val) {
$kwspval += parseInt($(object).val());
}
});
// Updating the Total
total = $expensesval - $socsoval - ($kwspval / 100 * $expensesval);
$expenseTotal = $(this).parents('tr').find('.total');
$expenseTotal.val(total)
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr>
<td><input type="hidden" name="txtid[]" value="1">
<input type="text" name="txtbasic[]" class="form-control expenses"></td>
<td><input type="text" name="txtallowance[]" class="form-control expenses"></td>
<td><input type="text" name="txtsocso[]" class="form-control socso"></td>
<td><input type="text" name="txtkwsp[]" class="form-control kwsp"></td>
<td><input type="text" name="txttotal[]" class="form-control total"></td>
</tr>
</table>