Answer the question
In order to leave comments, you need to log in
How to complete a jQuery calculator with a slider?
Hello. Can anyone help with a jQuery calculator along with a slider. The calculator should read installment payments. Stuck at the moment of displaying values in
<input type="text" class="form-control" id="monthprice" value="0" />
so that instead of 0 the value is substituted when you move the slider. It counts through everything, and the input remains with a zero value.
There is also a problem with entering the Initial payment$('#monathprice').val($result.toFixed(2));
console.log()
<input type="text" class="form-control" id="deposit" value="0" />
how to make the formula $depositprice = ($price - $deposit) + $percentage;
and in value be considered when entering the amount<input type="text" class="form-control" id="monthprice" value="0" />
sum was displayed dynamically. Now $depositprice = ($price - $deposit) + $percentage;
it displays 0 for some reason, even if you insert any number into the "Down payment" form. <div class="container">
<h1>Расчёт</h1>
<div class="row">
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-8">
<div class="slider"></div>
</div>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-4">
<div class="form-group">
<input type="number" class="form-control" disabled id="month" value="3" />
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-4">
<div class="form-group">
<label for="percentage">Ежемесячный платёж:</label>
<input type="text" class="form-control" id="monthprice" value="0" />
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-4">
<div class="form-group">
<label for="deposit">Первоначальный взнос</label>
<input type="text" class="form-control" id="
deposit" value="0" />
</div>
</div>
</div>
</div>
$( document ).ready(function() {
function update() {
$price = 3000;
$month = $("#month").val();
$deposit = $("#deposit").val();
if ($month == 3) {
$percentage = $price/100*6;
}
if ($month == 4) {
$percentage = $price/100*7.5;
}
if ($month == 5) {
$percentage = $price/100*8.5;
}
if ($month == 6) {
$percentage = $price/100*10;
}
if ($month == 7) {
$percentage = $price/100*12;
}
if ($month == 8) {
$percentage = $price/100*13;
}
if ($month == 9) {
$percentage = $price/100*14;
}
if ($month == 10) {
$percentage = $price/100*15;
}
if ($month == 11) {
$percentage = $price/100*17;
}
if ($month == 12) {
$percentage = $price/100*18;
}
if ($month == 18) {
$percentage = $price/100*25;
}
if ($month == 20) {
$percentage = $price/100*27.5;
}
if ($month == 24) {
$percentage = $price/100*31.5;
}
$depositprice = ($price - $deposit) + $percentage;
$result = ($price + $percentage) / $month;
if ($deposit == NaN) {
$('#monathprice').val($depositprice.toFixed(2)); console.log($depositprice.toFixed(2));
}
else {
$('#monathprice').val($result.toFixed(2));
console.log($result.toFixed(2));
}
}
$(function() {
var valMap = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 18, 20, 24];
$(".slider").slider({
min: 3,
max: valMap.length - 1,
value: this.value,
range: false,
slide: function(event, ui) {
$("#month").val(valMap[ui.value]);
update();
}
})
})
$('#month').on('change', function(){
if(+$(this).val() > 24) {
$(this).val(24);
}
if(+$(this).val() < 3) {
$(this).val(3);
}
});
$('#month').on('click', function(){
$( ".slider" ).slider( "value", this.value );
}).trigger('keyup');
update()
});
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question