html - Use jQuery to populate sibling hidden input -
for calculation currencies, need value of input parsed integer , value should populate sibling input of type "hidden".
i make reusable possible, use same script inputs it.
html:
<div class="input-group" id="total-emplcosts"> <span class="input-group-addon">total employer costs</span> <input type="text" class="form-control" name="empl_costs_inp" id="empl_costs_inp" /> <input type="hidden" name="empl_costs" id="empl_costs" /> </div> jquery
tried: (not doing @ all)
$('.input-group input').on('keyup blur focusout',function() { if($(this).val() !== '') { var inputvalue = $(this).val(); var integervalue = parseint(inputvalue * 100); $('input').siblings('input').val(integervalue); } } and: (adding integervalue hidden inputs)
$('.input-group input').on('keyup blur focusout',function() { if($(this).val() !== '') { var inputvalue = $(this).val(); var integervalue = parseint(inputvalue * 100); $('input').next('input[type=hidden]').val(integervalue); } } i think i'm quite close solution, need nodge in right direction.
change line
var integervalue = parseint(inputvalue * 100); to
var integervalue = parseint(inputvalue) * 100; basically parse inputvalue first before multiplying
also
- you missed
)@ end - it better if declared variables outside of function, won't created every time event fires
your script this
var inputvalue, integervalue; $('.input-group input').on('keyup blur focusout',function() { if($(this).val() !== '') { inputvalue = $(this).val(); integervalue = parseint(inputvalue) * 100; $('input:text').siblings('input:hidden').val(integervalue); } }); regarding comment, can use
parsefloat() instead of parseint(). also cannot multiply number string in javascript. have parse before performing mathematical operation.
edit 2
this html
<div class="input-group" id="rate"> <span class="input-group-addon">rate per day/hour</span> <input type="text" class="form-control" name="rate_inp" id="calc_rate_inp" /> <input type="hidden" name="rate" id="calc_rate" /> </div> <div class="input-group" id="bill-costs"> <span class="input-group-addon">billable costs</span> <input type="text" class="form-control" name="bill_costs_inp" id="bill_costs_inp" /> <input type="hidden" name="bill_costs" id="bill_costs" /> </div> now, part of script $('.input-group input'), selects every input in every .input-group, , have 2 .input-group, that's why both of input:hidden selected.
to fix this, can use $(this).
so change line $('input:text').siblings('input:hidden').val(integervalue);
$(this).siblings('input:hidden').val(integervalue); here updated fiddle.
Comments
Post a Comment