Показать сообщение отдельно
  #4 (permalink)  
Старый 01.01.2015, 22:35
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Сообщение от Symba87
Суть задачи:
1. на форме имеем 4 <select> с <option> у первого со значениями от 1 до 9, у второго и третьего - от 0 до 8, у четвертого - от 0 до 2.
2. нужно отследить, чтоб при отправке формы (submit()) сумма значений всех 4 <select> не превышала 9.
3.Количество опций в селектах должно быть взаимозависимым, то есть при выборе в первом, например, значения 4, в остальных нужно запретить выбор значения, превышающего 5, дабы не превысить общей суммой число 9.

Конкретный пример - форма заказа авиабилета с категориями пассажиров (Взрослый, подросток, младенец, младенец без отдельно предоставленного места), естественно, сумма пассажиров в заказе не должна превысить 9.
<div></div>
<script>
function createDependableSelects(obj) {
	obj.selectPointsArray.map(function(spa, index, mas) {
		spa.select = document.createElement("select");
		for ( var i = 0, length = spa.end - spa.start + 1; i < length; i++ ) {
			spa.select.options[i] = new Option(spa.start++);
		}
		obj.parent.appendChild(spa.select);
		spa.select.addEventListener("change", function () {
			var amount = 0;
			mas.map(function (value) {
				amount += value.select.selectedIndex;
			});
			if (amount >= obj.sum) {
				this.selectedIndex = 0; 
				alert("too much");
			}
		});
	});
}

//usage
createDependableSelects({
	selectPointsArray: [
			{start: 1, end: 9},
			{start: 0, end: 8},
			{start: 0, end: 8},
			{start: 0, end: 2}
		],
	parent: document.querySelector("div"),
	sum: 9
});
</script>
Ответить с цитированием