Задать вопрос
@Goldi

Как добавить инпут в пересчет на калькуляторе?

Есть код калькулятора необходимо добавить в пересчет цены инпут например такой
<div class="flex_row aic">
						<input value="150" type="checkbox" data-cw="150" <?=($warming_necessary)?"checked=\"\"":""?> id="checkbox_calc" class="dn" name="warming"><label for="checkbox_calc" class="checkbox"></label>
						<p>
 <strong>Нужно утепление</strong>
						</p>
					</div>

Как это сделать не мешая работе всего калькулятора?
Сам скрипт:
$(document).ready(function() {
	$('[js-calculateForm]').on('change', function(e,pc=null,pw=null){
		var $form = $(this);


		var calcPrice = $form.find('.form__result-title i')
		var calcCreditPrice = $form.find('.form__result-subtitle i')

		var calcType_cost = $form.find('select[name="house"] :selected').attr('data-c')?$form.find('select[name="house"] :selected').attr('data-c'):0
		var calcType_cost_work = $form.find('select[name="house"] :selected').attr('data-cw')?$form.find('select[name="house"] :selected').attr('data-cw'):0

		var calcSquare = $form.find('input[name="square"]').val()

		var calcMaterial_cost = $form.find('select[name="material"] :selected').attr('data-c')?$form.find('select[name="material"] :selected').attr('data-c'):0
		var calcMaterial_cost_work = $form.find('select[name="material"] :selected').attr('data-cw')?$form.find('select[name="material"] :selected').attr('data-cw'):0

		if(calcMaterial_cost==0){
			calcType_cost=0;
		}

		var c = $form.find('.calculate__type-el.is-selected').data('c');
		var cw = $form.find('.calculate__type-el.is-selected').data('cw');
		var c_t =  $form.find('.calculate__type-el.is-selected').data('c_t');
		var cw_t = $form.find('.calculate__type-el.is-selected').data('cw_t');


		if($('select[name="material"] :selected').val()=='Мягкая кровля'){
			var coeff_roof = $form.find('.calculate__type .type_k').data('c_t')?pc>0?pc:c_t:0;
			$form.find('.calculate__type .type_k').attr('data-c_t',c_t);
			var coeff_work_roof =  $form.find('.calculate__type .type_k').data('cw_t')?pw>0?pw:cw_t:0;
			$form.find('.calculate__type .type_k').attr('data-cw_t',cw_t);
		}else{
			var coeff_roof = $form.find('.calculate__type .type_k').data('c')?pc>0?pc:c:0;
			$form.find('.calculate__type .type_k').attr('data-c',c);
			var coeff_work_roof =  $form.find('.calculate__type .type_k').data('cw')?pw>0?pw:cw:0;
			$form.find('.calculate__type .type_k').attr('data-cw',cw);

		}

		var calcWarming = $form.find('input[name="warming"]').is(':checked')


		 if(calcWarming){
			  $('.house_block').show();
		  }else{
			  $('.house_block').hide();
		  }

		var basePrice = 0 // rub, per square meter
		var koeff = $form.find('.koeff').val() // koeff
		var yearlyInterest = 14 // percent
		var resultPrice = basePrice

		// first up for saved numbers
		curCalcPrice = parseInt(calcPrice.html().replace(/ /g, ''))
		curCreditPrice = parseInt(calcCreditPrice.html().replace(/ /g, ''))

		
		var log = {
			'Материал':$('select[name="material"] :selected').val()+'['+calcMaterial_cost+']['+calcMaterial_cost_work+']',
			'Тип сооружения':$('select[name="house"] :selected').val()+'['+calcType_cost+']['+calcType_cost_work+']',
			'Тип крыши':$form.find('.calculate__type-el.is-selected').text()+'['+coeff_roof+']['+coeff_work_roof+']',
			'Коэффиценты работ без тепла':'['+c+']['+cw+']',
			'Коэффиценты работ c теплом':'['+c_t+']['+cw_t+']',
			'Площадь':calcSquare,
			'Тепло':calcWarming
		};console.log(log);
		

		if (calcWarming){
			if(coeff_roof>0 && coeff_work_roof>0){
				resultPrice = koeff*((parseFloat(coeff_roof)*(parseInt(calcMaterial_cost)+parseInt(calcType_cost)))+(parseFloat(coeff_work_roof)*(parseInt(calcType_cost_work)+parseInt(calcMaterial_cost_work))));
				var formula = koeff+'*(('+coeff_roof+'*('+calcMaterial_cost+'+'+calcType_cost+'))+('+coeff_work_roof+'*('+calcType_cost_work+'+'+calcMaterial_cost_work+')))';
			}else{
				resultPrice = koeff*((parseInt(calcMaterial_cost)+parseInt(calcMaterial_cost_work)+parseInt(calcType_cost)+parseInt(calcType_cost_work)));
				var formula = koeff+'*(('+calcMaterial_cost+'+'+calcMaterial_cost_work+')+('+calcType_cost+'+'+calcType_cost_work+'))';
			}
		}else{
			if(coeff_work_roof>0){ // крыша
				resultPrice = koeff*((parseFloat(coeff_roof)*(parseInt(calcMaterial_cost)))+(parseFloat(coeff_work_roof)*(parseInt(calcMaterial_cost_work))));
				var formula = koeff+'*(('+coeff_roof+'*('+calcMaterial_cost+'))+('+coeff_work_roof+'*('+calcMaterial_cost_work+')))';
			}else{
				resultPrice = koeff*((parseInt(calcMaterial_cost)+parseInt(calcMaterial_cost_work)));
				var formula = koeff+'*('+calcMaterial_cost+'+'+calcMaterial_cost_work+')';
			}
		}

		//alert(koeff+' * '+'('+parseFloat(coeff_roof)+'*'+'('+parseInt(calcMaterial_cost)+'*'+'100'+'+'+parseInt(calcMaterial_cost_work)+'*'+'100)+'+parseFloat(coeff_work_roof)+'*('+parseInt(calcType_cost)+'*100+'+parseInt(calcType_cost_work)+'*'+'100))');
		//console.log(koeff+'*'+'(('+parseFloat(coeff_roof)+'*'+'('+parseInt(calcMaterial_cost)+'))'+'+'+'('+parseFloat(coeff_work_roof)+'*('+parseInt(calcMaterial_cost_work)+')))');
		if ( calcSquare > 0 ){
		  resultPrice = resultPrice * Math.abs(calcSquare)
		}


		// update html
		var creditPrice = Math.floor((resultPrice * (1 + (yearlyInterest/100))) / 12)


		if(resultPrice>0){
			$('.ifnull').hide();
			$('.ifnotnull').show();
		}else{
			$('.ifnull').show();
			$('.ifnotnull').hide();
		}


		//console.log(curCalcPrice, resultPrice)
		calcPrice.prop('Counter',curCalcPrice).animate({
		  Counter: resultPrice
		}, {
		  duration: 600,
		  easing: 'swing',
		  step: function (now) {
			$(this).html(numberWithSpace(Math.floor(now)));
		  }
		});

		calcCreditPrice.prop('Counter',curCreditPrice).animate({
		  Counter: creditPrice
		}, {
		  duration: 600,
		  easing: 'swing',
		  step: function (now) {
			$(this).html(numberWithSpace(Math.floor(now)));
		  }
		});


	});
	
	$('.secMap_list').mCustomScrollbar({
		theme: "dark",
	});	
});

Код в шаблоне :
<div class="sec secCount secDark secCount_main">
	<div class="container">
		<h2>Расчет стоимости<br>
		 монтажа</h2>
		<div class="secCount_content flex_row jcsb">
			<div class="secCount_text flex_item2">
				<form action="#" method="post" data-animation-delay=".1s" js-calculateform="" class="form calculate__form wow wowFadeUp">
					<p>
						
					</p>
					<div class="flex_row secCount_row aic">
						<div class="flex_item2">
							<p>
 <strong>Укажите площадь:</strong>
							</p>
							<div class="flex_row aic">
 <input type="text" class="input flex_item2" value="<?=$arResult['PROPERTIES']['MIN_SQUARE']['VALUE'];?>" placeholder="2000" name="square">
								<p>
 <strong>кв. м.</strong>
								</p>
							</div>
						</div>
						<div class="flex_item2">
							<p>
 <strong>Выберите вид материала:</strong>
							</p>
							<select name="material" class="select">
							<?if ($arResult['PROPERTIES']['LETO']['VALUE'] == 'Да'){?>
							<? foreach($material as $key => $val):?>
							<? list($desc, $value) = explode(":",$val);?>
								<option value="<?=$value;?>" data-c="<?=$desc;?>" data-cw="0"><?=$value;?></option>
							<? endforeach;?>
							<?}else{?>
							<? foreach($materialzima as $key => $val):?>
							<? list($desc, $value) = explode(":",$val);?>
								<option value="<?=$value;?>" data-c="<?=$desc;?>" data-cw="0"><?=$value;?></option>
							<? endforeach;?>
							<?}?>
							</select>
						</div>
					</div>
					<div class="flex_row aic">
						<input value="150" type="checkbox" data-cw="150" <?=($warming_necessary)?"checked=\"\"":""?> id="checkbox_calc" class="dn" name="warming"><label for="checkbox_calc" class="checkbox"></label>
						<p>
 <strong>Нужно утепление</strong>
						</p>
					</div>

					<!---<div class="house_block" <?=($warming_necessary)?"style=\"display: none;\"":""?>>
						<p>
 <strong>Ваш тип здания:</strong>
						</p>
						<select name="house" id="" class="select">
							<? foreach($building_type as $key => $val):?>
							<? list($desc, $value) = explode(":",$val);?>
								<option value="<?=$value;?>" data-c="<?=$desc;?>" data-cw="0"><?=$value;?></option>
							<? endforeach;?>
						</select>
					</div> --->
					<div class="secCount_price form__result-title">
						<p>
 <strong>Стоимость:</strong>
						</p>
						<?=$arResult['PROPERTIES']['PRICEREAL']['~VALUE'];?>
						<p class="form__result-subtitle">
							<?=$arResult['PROPERTIES']['KREDITREAL']['~VALUE'];?>
						</p>
					</div>
 <input type="hidden" class="koeff" name="koeff" value="1"> <input type="hidden" name="act" value="calculator"> <a href="#" data-link="#exact_calculation" onclick="structCalcData();return false;" class="trigger btn btn_primary">Заказать точный расчет</a>
					<p>
						 Нажимая на кнопку "Заказать монтаж", вы соглашаетесь с правилами обработки данных
					</p>
				</form>
			</div>
			</div>
		</div>
	</div>
</div>
  • Вопрос задан
  • 52 просмотра
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы