javascript - jquery multiplication - behind the scene calculation -
i have calculator:
this html :
<div class="row"> <div class="twenty columns"> <h2 class="secondary-title text-red2">mortgage utilisation calculator</h2> <form> <div class="row forminput"> <div class="ten columns"> <p class="slider-label">daily flexi account balance (rm)</p> <input type="text" class="daily-flexi-accbalance strictly-numbers" value="200000" /> </div> <div class="ten columns"> <p class="slider-label">number of days in month</p> <div class="field type-dropdown"> <div class="picker picker-dd2"> <select class="dropdown2 numdays-month"> <option value="0">please select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> </div> </div> </div> <div class="ten columns"> <p class="slider-label">current facility limit (rm)</p> <input type="text" class="curr-facilitylimit numeric-only" value="500000" /> </div> <div class="ten columns"> <p class="slider-label">excess payment (rm)</p> <input type="text" class="curr-facilitylimit numeric-only" value="" /> </div> </div> </form> <div class="row bg-gray12"> <div class="ten columns bg-gray12 data-box2"> <div class="row"> <div class="twelve columns">sum of daily flexi account balance</div> <div class="eight columns text-right calc-result-sumflexiacc " data-prefix="rm " data-suffix="">rm 0</div> </div> </div> <div class="ten columns bg-gray11 data-box2"> <div class="row"> <div class="twelve columns">monthly utilisation rate</div> <div class="eight columns text-right calc-result-mthly-utilisationrate text-right" data-prefix="rm " data-suffix="">0 %</div> </div> </div> </div> <!-- <div class="row bg-gray9 data-box2 font-brighter"> <div class="fifteen columns ">total amount payable</div> <div class="five columns text-right calc-result-totalpayable" data-prefix="rm " data-suffix="">rm 0</div> </div> --> </div> </div> i have function calculate sum of daily flexi acc
function calcsumdailyflexiaccbalance() { var numdaysmonth; $(".numdays-month").on('change', function() { numdaysmonth = parseint($(".numdays-month").val(), 10); }); var dailyflexi = parseint($(".daily-flexi-accbalance").val(), 10); var resultdaysflexi = numdaysmonth * dailyflexi; var roundresult = math.round(resultdaysflexi/100)*100 } in order value field: sum of daily flexi account balance - calculation daily flexi account balance * num of days - result rounded nearest hundredth.
for example daily flexi account balance : 265806, num of day : 31, sum of daily flexi acc balance : 8,239,986 , correct output 8,240,000
for reason don't think calculation outputting correct amount because i'm getting nan
change number of days dropdown, log output of calculation, looks correct (i.e. no nan)
function init() { $(".numdays-month").on('change', function() { var numdaysmonth; numdaysmonth = parseint($(".numdays-month").val(), 10); var dailyflexi = parseint($(".daily-flexi-accbalance").val(), 10); var resultdaysflexi = numdaysmonth * dailyflexi; var roundresult = math.round(resultdaysflexi/100)*100 console.log(roundresult); } ); } $(document).ready(init); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> <body> <div class="row"> <div class="twenty columns"> <h2 class="secondary-title text-red2">mortgage utilisation calculator</h2> <form> <div class="row forminput"> <div class="ten columns"> <p class="slider-label">daily flexi account balance (rm)</p> <input type="text" class="daily-flexi-accbalance strictly-numbers" value="200000" /> </div> <div class="ten columns"> <p class="slider-label">number of days in month</p> <div class="field type-dropdown"> <div class="picker picker-dd2"> <select class="dropdown2 numdays-month"> <option value="0">please select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> </div> </div> </div> <div class="ten columns"> <p class="slider-label">current facility limit (rm)</p> <input type="text" class="curr-facilitylimit numeric-only" value="500000" /> </div> <div class="ten columns"> <p class="slider-label">excess payment (rm)</p> <input type="text" class="curr-facilitylimit numeric-only" value="" /> </div> </div> </form> <div class="row bg-gray12"> <div class="ten columns bg-gray12 data-box2"> <div class="row"> <div class="twelve columns">sum of daily flexi account balance</div> <div class="eight columns text-right calc-result-sumflexiacc " data-prefix="rm " data-suffix="">rm 0</div> </div> </div> <div class="ten columns bg-gray11 data-box2"> <div class="row"> <div class="twelve columns">monthly utilisation rate</div> <div class="eight columns text-right calc-result-mthly-utilisationrate text-right" data-prefix="rm " data-suffix="">0 %</div> </div> </div> </div> <!-- <div class="row bg-gray9 data-box2 font-brighter"> <div class="fifteen columns ">total amount payable</div> <div class="five columns text-right calc-result-totalpayable" data-prefix="rm " data-suffix="">rm 0</div> </div> --> </div> </div></body> 
Comments
Post a Comment