Getting wrong calculation in javascript

Question

I am having table below.. but Getting wrong calculation in javascript..

在此输入图像描述

     <script>
         function getPrice(tRate, tMaking, tHandeling, tPrice, tVat, tQuantity, tTotal) {
             var obj_tRate = document.getElementById(tRate)
             var obj_tMaking = document.getElementById(tMaking)
             var obj_tHandeling = document.getElementById(tHandeling)
             var obj_tPrice = document.getElementById(tPrice)
             var obj_tVat = document.getElementById(tVat)
             var obj_tTotal = document.getElementById(tTotal)
             var obj_tQuantity = document.getElementById(tQuantity)
             if (obj_tRate.value != "" && obj_tMaking.value != "" && obj_tHandeling.value != "") {
                 obj_tPrice.value = parseFloat(obj_tRate.value) + parseFloat(obj_tMaking.value) + parseFloat(obj_tHandeling.value);
                 console.log(obj_tPrice.value)
                 obj_tVat.value = parseFloat(obj_tPrice.value * (1 / 100));
                 console.log(obj_tVat.value)
                 obj_tTotal.value = parseFloat(obj_tVat.value + (obj_tPrice.value * obj_tQuantity.value));
                 console.log(obj_tTotal.value)
             }
             else {
                 obj_tPrice.value = "";
             }
         }

</script>

</head>
<body>
    <table>
        <tr>
            <td>
                        <input name="grdView$ctl08$txtWaight_F" type="text" id="grdView_ctl08_txtWaight_F" class="classWaight" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtQuantity_F" type="text" maxlength="20" id="grdView_ctl08_txtQuantity_F" class="classQuantity" onchange="javascript:return getPrice('grdView_ctl08_txtRate_F','grdView_ctl08_txtMaking_F','grdView_ctl08_txtHandeling_F','grdView_ctl08_txtPrice_F','grdView_ctl08_txtvat_F','grdView_ctl08_txtQuantity_F','grdView_ctl08_txtTotal_F');" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtRate_F" type="text" maxlength="8" id="grdView_ctl08_txtRate_F" class="classRate" onchange="javascript:return getPrice('grdView_ctl08_txtRate_F','grdView_ctl08_txtMaking_F','grdView_ctl08_txtHandeling_F','grdView_ctl08_txtPrice_F','grdView_ctl08_txtvat_F','grdView_ctl08_txtQuantity_F','grdView_ctl08_txtTotal_F');" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtMaking_F" type="text" id="grdView_ctl08_txtMaking_F" class="classMaking" onchange="javascript:return getPrice('grdView_ctl08_txtRate_F','grdView_ctl08_txtMaking_F','grdView_ctl08_txtHandeling_F','grdView_ctl08_txtPrice_F','grdView_ctl08_txtvat_F','grdView_ctl08_txtQuantity_F','grdView_ctl08_txtTotal_F');" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtHandeling_F" type="text" id="grdView_ctl08_txtHandeling_F" class="classHandling" onchange="javascript:return getPrice('grdView_ctl08_txtRate_F','grdView_ctl08_txtMaking_F','grdView_ctl08_txtHandeling_F','grdView_ctl08_txtPrice_F','grdView_ctl08_txtvat_F','grdView_ctl08_txtQuantity_F','grdView_ctl08_txtTotal_F');" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtPrice_F" type="text" id="grdView_ctl08_txtPrice_F" class="classPrice" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtvat_F" type="text" id="grdView_ctl08_txtvat_F" class="classVat" style="width:60px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtTotal_F" type="text" id="grdView_ctl08_txtTotal_F" class="classTotal" style="width:100px;" />
                    </td><td>
                        <input name="grdView$ctl08$txtSerial_F" type="text" id="grdView_ctl08_txtSerial_F" class="classSerial" />
                    </td>
        </tr>
    </table>
</body>

Answer 1

Use parseFloat on the operands, not on the result of the computation.

For example, replace

obj_tTotal.value = parseFloat(obj_tVat.value + (obj_tPrice.value * obj_tQuantity.value));

with

var tPrice = parseFloat(obj_tPrice.value);
var tQuantity = parseFloat(obj_tQuantity.value);
obj_tTotal.value = tPrice + tPrice * tQuantity;

When you add, like you did, a string and a number, you do a string concatenation.

For example

"1000" + "5" * "100"

gives

"1000" + 500

which is

"1000500"

At this point, it's too late to call parseFloat .

Getting wrong calculation in javascript

Question

1 answers

solution1
2 ACCPTED 2013-08-17 20:02:08

Getting wrong calculation in javascript

Question

1 answers

solution1 2 ACCPTED 2013-08-17 20:02:08

solution1
2 ACCPTED 2013-08-17 20:02:08