Click here to Skip to main content
15,906,816 members
Please Sign up or sign in to vote.
1.00/5 (2 votes)
See more:
I have code which calculates 8% of the number entered, so for example is in the code below. If you enter "1" in the first box" and "100" in the second box the Total Refund (including 8%) = 108

JavaScript code:

JavaScript
$(document).ready(function() {
var sum = 0;
function calcSum(prevVal) {
var val1 = $('#val1').val();
var val2 = $('#val2').val();
var val3 = $('#val3').val();
var val4 = $('#val4').val();
this.sum = parseFloat(val1) * parseFloat(val2) + parseFloat(val3) * parseFloat(val4);
return this.sum;
}
var subAmt = $("#sub"),
taxAmt = $("#tax"),
totAmt = $("#total");
$(".val").each(function() {
var prevVal = this.value / 1,
self = this;
$(this).keyup(function() {
subAmt.val(calcSum.call(self, prevVal));
totAmt.val(this.sum + this.sum * parseFloat(taxAmt.val() / 100));
prevVal = self.value; 
});
});
});


http://jsfiddle.net/2k1zr59u/3/

What I would like to do is to calculate 20% of the 8% in the second to the bottom box. So in this example the answer should be 1.60.

Then I would like to show in the total box 106.40 (108 - 1.60).
Posted
Updated 11-Jun-15 3:14am
v2
Comments
ZurdoDev 11-Jun-15 8:53am    
If you can do one calculation where are you stuck doing a second one?
padders01 11-Jun-15 9:12am    
Not sure where to start to be honest. I've tried a few things but had no luck so far. Not an expert at this at all.
padders01 12-Jun-15 4:08am    
Can anyone help me please?

1 solution

I have tweaked your solution a bit to make it work. But this is not an ideal way of doing things.

HTML
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
 $(document).ready(function(){
    var sum = 0;
    function calcSum(prevVal){
        
       var val1 =   $('#val1').val();
       var val2 =   $('#val2').val();
       var val3 =   $('#val3').val();
       var val4 =   $('#val4').val();

        this.sum = parseFloat(val1) * parseFloat(val2) + parseFloat(val3) * parseFloat(val4);
        return this.sum;
    }
    
    var subAmt = $("#sub");
    var taxAmt = $("#tax");
    var tmpTotalRef20=$("#totalRef20");
    var totAmt = $("#total");
    var taxAmt20 = $("#taxa");
    var costOfPremium = $("#val2");
    var totalb = $("#totalb");
    

    
    $(".val").each(function(){
        var prevVal = this.value/1, self = this;
        
        $(this).keyup(function(){
            subAmt.val(calcSum.call(self, prevVal));
            prevVal = self.value;
            var eightPercent = parseFloat(costOfPremium.val())*parseFloat(taxAmt.val()/100);
            var twentyPercent = eightPercent * parseFloat(taxAmt20.val()/100);
			      tmpTotalRef20.val(twentyPercent);	
            totAmt.val(this.sum + this.sum*parseFloat(taxAmt.val()/100));
            var finalTotal = parseFloat(totAmt.val() - twentyPercent);
            totalb.val( finalTotal);
        });
    });
});
</script>
</head>
<table>
<tr>
  <td style="text-align: left;">Number of payments to refund: </td>
  <td style="text-align: left;"><input name="Numofpayments" type="text" class="val" id="val1"/></td>
  <td></tr><p>
<tr>
  <td style="text-align: left;">Cost of premium: </td>
  <td style="text-align: left;"><input name="Premium" type="text" class="val" id="val2"></td>
  <td></tr><p>
      
<tr>
  <td style="text-align: left;">Additional number of payments to refund: </td>
  <td style="text-align: left;"><input name="Numofpayments2" type="text" class="val" id="val3" value="0"/></td>
  <td></tr><p>
<tr>
  <td style="text-align: left;">Additional cost of premium: </td>
  <td style="text-align: left;"><input name="Premium2" type="text" class="val" id="val4" value="0"/></td>
  <td></tr><p>
<tr>
  <td style="text-align: left;">Sub Total: </td>
  <td style="text-align: left;"><input name="SubTotal" type="text" id="sub" value="0" readonly/></td>
  <td></tr><p>
<tr>
  <td style="text-align: left;">Total Refund (including 8% redress) </td>
  <td style="text-align: left;"><input name="TotalRefund" type="text" id="total" value="0" readonly/></td> 
</tr><p>
<tr>
  <td style="text-align: left;">Total Refund (including 20% of the 8%) </td>
  <td style="text-align: left;"><input name="TotalRefund20" type="text" id="totalRef20" value="0" readonly/></td><p>
</tr>
    <tr>
  <td style="text-align: left;">Total </td>
  <td style="text-align: left;"><input name="Total" type="text" id="totalb" value="0" readonly/></td>
</tr>
</table>
  <input type="hidden" id="tax" value="8" readonly/>
  <input type="hidden" id="taxa" value="20" readonly/>
</html>
 
Share this answer
 
Comments
padders01 12-Jun-15 6:36am    
That's absolutely brilliant, thank you so much

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900