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

Question

[add99]

Надо сделать калькулятор для расчета страховки.
1) как вылавливать значение option если их выбрали(у каждого option свое значение, например value="auto1-1" (1), value="auto1-2" (1.20), value="auto5"(0.8))
2) Если поставить галочку на checkbox сработает коэффициент 0.80, а если не ставить, то коэффициент 1
3) в итоге 1680 * на значение выбранного option * на коэффициент чекбокса.

<select>
  <optgroup label="легковой автомобиль">
		<optgroup label="Объем двигателя">
			<option value="auto1-1">Менее 2000 куб.см.</option>
			<option value="auto1-2">от 2001 до 3001 куб. см.</option>
			<option value="auto1-3">свыше 3001 куб. см.</option>
		</optgroup>
  </optgroup>
	<option value="auto5">троллейбус</option>
	<option value="auto6">мототранспорт</option>
</select>

									<div class="form-check">
										<input class="form-check-input" type="checkbox" value="" id="check4">
										<label class="form-check-label name__input" for="check4">
											Диагностическая карта о прохождении технического осмотра
										</label>
									</div>

Answer 1

[Сергей Соколов]

По событию изменения селекта или чекбокса, всё перерасчитывать:

Comments

[add99]

Спасибо большое))

[add99]

Добавляю в const total = bType, калькулятор не считает. Ошибок ничего нет. В чем проблема?

const citizenship ={
	'kg': 1.0,
	'oth': 2.20,
};

const select = document.querySelector('select');
const select1 = document.querySelector('#citizenship');
const check = document.querySelector('#check4');
const result = document.querySelector('#result');

const update = () => {
  const cType = coefficients[select.value];
	const bType = citizenship[select.value];
  const cDiag = check.checked ? 0.8 : 1;
  const total = 1680 * cType * bType * cDiag;
  result.innerText = `Итоговая цена: ${total.toFixed(2)} руб`;
}

[ForSureN1]

add99, у селекта соответствующие поля есть хоть? с kg и oth

[Сергей Соколов]

add99,

-  const bType = citizenship[select.value];
+  const bType = citizenship[select1.value];

[add99]

ForSureN1, да

<select class="form-select" name="citizenship" id="citizenship">
	<option selected></option>
	<option value="kg">Кыргызская Республика</option>
	<option value="oth">Иностранное государство</option>
</select>

[add99]

Сергей Соколов, Еще раз, спасибо большое!) Помогло

[Сергей Соколов]

add99, только раз селектов несколько, не поленитесь их переименовать в более длинные и более понятные, скажем, selectCarType и selectCountry

А то следующий разработчик, которому придётся разбираться в вашем коде может узнать, где вы живёте, и прийти.. Ночью..

[add99]

Сергей Соколов, ахах, хорошо)