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