Калькулятор! Как сделать цены с выбором?

Question

[dzho]

Всем привет! Есть калькулятор с ценами. Но сейчас нужно немного расширить функционал:

Сейчас он работает так каждый option c заданной ценой. Показывает значение в checkboxсами и option
Вопрос: Как реализовать, если поставить например "Эмалировка1" то и соотвественно список с ценами менялся тоже?

Вот ссылка на код: https://jsfiddle.net/jjwcj24m/
Вставлю еще здесь.

При выборе:
Сейчас:
Эмалировка1
Размер ванны: Маленькая цена: 300 руб

Реализовать:
Эмалировка2
Размер ванны: Маленькая цена: 350руб

<table border="1">
<tr style="background:#cfc;"><td>Услуга:</td><td>Цена</td></tr>
<tr><td>
    <select id="one" class="bath">
	<option value="0руб">Эмалировка...</option> 
    <option value="350руб">Эмалировка 1</option> 
    <option value="450руб">Эмалировка 2</option> 
    <option value="550руб">Эмалировка 3</option> 
    </select>
</td><td>
	<!-- зависимость с первым selector -->
	<input type="text" value="0руб" id="t_one" class="price">
</td></tr>
<tr><td>
    <select id="two" class="bath">
	<option value="0руб">Размер ванны...</option>
    <option value="650руб">Маленькая</option>
    <option value="750руб">Средняя</option>
    <option value="850руб">Большая</option>
    </select>
</td><td>
	<!-- зависимость с вторым selector -->
	<input type="text" value="0руб" id="t_two" class="price">
</td></tr>
<tr><td>
    <select id="three" class="bath">
	<option value="0руб">Цвет...</option>
    <option value="950руб">красный</option>
    <option value="1050руб">синий</option>
    <option value="1150руб">зеленый</option>
    </select>
</td><td>
	<!-- зависимость с третьим selector -->
	<input type="text" value="0руб" id="t_three" class="price">
</td></tr>
<tr><td>
 <input type="checkbox" value="1250руб" id="bath" class="bort"><label for="bath">Установка уголка по бортам ванны</label>
</td><td>
<!-- зависимость с первым radio -->
<input type="text" value="0руб" id="t_bath" class="price">
</td></tr>
<tr><td>
<input type="checkbox" value="1350руб" id="sink" class="bort"><label for="sink">Установка сливной системы</label>
</td><td>
<!-- зависимость с вторым radio -->
<input type="text" value="0руб" id="t_sink" class="price">
</td></tr>
<tr><td>
<input type="checkbox" value="1450руб" id="screen" class="bort"><label for="screen">Установка экрана под ванну</label>
</td><td>
<!-- зависимость с третьим radio -->
<input type="text" value="0руб" id="t_screen" class="price">
</td></tr>
<tr><td>
<input type="checkbox" value="1550руб" id="counter" class="bort"><label for="screen">Установка счетчиков горячей и холодной воды</label>
</td><td>
<!-- зависимость с четвертым radio -->
<input type="text" value="0руб" id="t_counter" class="price">
</td></tr>
<tr><td>
<input type="checkbox" value="1650руб" id="inspection" class="bort"><label for="inspection">Проверка счетчиков</label>
</td><td>
<!-- зависимость с пятым radio -->
<input type="text" value="0руб" id="t_inspection" class="price">
</td></tr>
 <tr><td>
Итого
</td><td>
 <!-- в этом inpute подсчет стоимости всех выбранных значений -->
<input type="text" value="0руб" id="t_summ">
 </td></tr>
 </table>

$(document).ready(function () {

$('select.bath').change(function(){
	var id = $(this).attr('id');
	$('#t_'+id).val($(this).val());
	calc();
});

$('input.bort').click(function(){
	var chk = $(this).prop('checked'),
		id = $(this).attr('id');
	$('#t_'+id).val(chk ? $(this).val() : '0руб');
	calc();
});

function calc(){
	var sum = 0;
	$('input.price').each(function(){
		sum += parseInt($(this).val());
	});
	$('#t_summ').val(sum+'руб');
}

});

Comments

[OVK2015]

Формировать эл-ты дочерних списков при выборе в родительском значениями из связанных массивов

Answer 1

[Adamos]

Стоит переделать логику калькулятора.
1. В форме выводятся просто варианты выбора, без прописывания в них цены.
2. При любом изменении собираем все данные формы.
3. Исходя из известных данных, делаем расчет (используя готовые таблицы цен в зависимости от параметров).
4. Выводим в каждый пункт его стоимость, выведенную в расчете.

Преимущества:
1. Можно будет заменить эти жуткие выпадающие списки, например, группой кнопок с переключателем. И вообще - навести хоть какой-то дизайн.
2. Цены могут браться с внешнего источника. Можно будет прикрутить к админке правку этих цен без вмешательства в код калькулятора. Или сделать конструктор калькулятора из той же админки (с настройкой - вот такой контрол вот так влияет на расчет).