Adding, Subtracting and Multiplying form input values

Question

Based on this post from here, JQuery multiply input values of table rows, i used the same form field names and added Tax field and Discount field.

        <tr class="txtMult">
        <td>
            <input name="txtEmmail" class="val1"  />
        </td>
        <td>
            <input name="txtEmmail" class="val2"/>
        </td>
        <td>
            <span class="multTotal">0.00</span>
        </td>
    </tr>
        <tr class="txtMult">
        <td>
            <input name="txttax" class="val1"  />%
        </td>
        <td>

        </td>
        <td>
            <span class="multTax">0.00</span>
        </td>
    </tr>

This tax needs to be multiplied, like if i enter 10 (%)

var $tax = ($val1 * 1) * ($total * 1)/100;
$('.multTax', this).text($tax);

and then out put that as a tax amount I changed the txttax class value as val3 and added the jquery like above

again, I need to subtract the discount, I tried all possible ways, but no luck.

this is the function (Edited)

$(document).ready(function () {
   $(".txtMult input").keyup(multInputs);
   function multInputs() {
       var mult = 0;
       $("tr.txtMult").each(function () {
           var $val1 = $('.val1', this).val();
           var $val2 = $('.val2', this).val();
           var $val3 = $('.val3', this).val();
           var $total = ($val1 * 1) * ($val2 * 1);
           var $tax = ($val1 * 1) * ($total * 1)/100;
           $('.multTotal', this).text($total);
           $('.multTax', this).text($tax);
           mult += $total;
       });
       $("#grandTotal").text(mult);
   }
});

Please advise. (spent the whole day)

@sammry Please remove unrelated markup; it serves only to obfuscate. Only the form fields and spans matter. Keep questions focused only on relevant issues. Note that you have two fields with class .val1, two inputs named txtEmmail, and none named .val3, is this intentional? It seems odd and counter to your code. — Dave Newton
– Dave Newton, Commented Apr 21, 2013 at 0:43
@DaveNewton what exactly should i remove? am sorry, bit confused. — sammry
– sammry, Commented Apr 21, 2013 at 0:45
@DaveNewton yes, i used .val3 to multiply the $total and also tried as .val1, but no luck — sammry
– sammry, Commented Apr 21, 2013 at 0:51

Ozerich · Accepted Answer · 2013-04-21 01:02:59Z

2

jsFiddle solution

HTML

 <table>
 <tr class="txtMult">
    <td>
        <input name="txtEmmail" class="val1"  />
    </td>
    <td>
        <input name="txtEmmail" class="val2"/>
    </td>
    <td>
        <span class="multTotal">0.00</span>
    </td>
</tr>
    <tr class="txtMult odd">
    <td>
        <input name="txttax" class="val3"  />%
    </td>
    <td>

    </td>
    <td>
        <span class="multTax">0.00</span>
    </td>
 </tr>
 </table>

 <span id="grandTotal"></span>

JS

    $(document).ready(function () {

   $("input").keyup(multInputs);
   function multInputs() {
       var mult = 0;
       $("tr.txtMult").not('.odd').each(function () {           
           var $val1 = $('.val1', this).val();
           var $val2 = $('.val2', this).val();
           var $val3 = $('.val3', $(this).next()).val();

           var $total = $val1 * $val2;
           var $tax = $val3 * ($total / 100);

           $('.multTotal', this).text($total);
           $('.multTax', $(this).next()).text($tax);

           mult += $total - $tax;
       });

       $("#grandTotal").text(mult);
   }
});

edited Apr 21, 2013 at 1:02

answered Apr 21, 2013 at 0:50

Ozerich

2,0101 gold badge19 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

sammry Over a year ago

hi @ozerich , thanks for the answer, tax amount is not right. for val1=50 and val2=50 total is 5000, when i enter txttax=10 (%), the answer is not right, am playing with the multiplier now. Thanks

sammry Over a year ago

thank you so much @ozerich, i should follow the same for discount too as val4 with odd tr class

Collectives™ on Stack Overflow

Adding, Subtracting and Multiplying form input values

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related