Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Работа с раскрывающимся списком (https://javascript.ru/forum/dom-window/69262-rabota-s-raskryvayushhimsya-spiskom.html)

ZMA 15.06.2017 13:29

Dilettante_Pro, благодарю. Я сильно все усложнял :)

ZMA 15.06.2017 17:43

--

ZMA 16.06.2017 13:11

--

ФедорН 19.06.2017 00:09

привет.
У меня очень похожая ситуация. этот скрипт тоже подойдёт,но на элементы в том числе селект, нужно навешивать стили и т.п,а в js я ноль с плюсом.
если есть возможность поделитесь как переделать,чтобы select был не в скрипте, а в form вместе с input и output. Заранее выражаю благодарность

j0hnik 19.06.2017 00:25

<!DOCTYPE html>

<html>
<head>
	<title>Untitled</title>
	<meta charset="utf-8">
	<style type="text/css">
	</style>

	<script>
		window.addEventListener('DOMContentLoaded', function() {

function calculate() {
	var h = +height.value || 0,
	w = +width.value || 0,
	c = +select.value;
	h < 10 && (h = 10);
	w < 20 && (w = 20);
	h > 200 && (h = 200);
	w > 250 && (w = 250);
	height.value = h.toString();
	width.value  = w.toString();
	h = h * w;
	h <= 400 && (c *= 1.1);
	h *= c;
	output.innerHTML = h.toFixed(2)
}
var form = document.querySelector("#form"),
output = document.querySelector("#output"),
width = document.querySelector("#width"),
height = document.querySelector("#height"),
select = document.querySelector("#mySelect");

form.addEventListener("change", calculate);

});
</script>
</head>

<body>
	<form action="" id="form" >
		<input type="text" id="height">
		<input type="text" id="width">
		<select id="mySelect">
			<option value="1"/>красный</option>
			<option value="1.2"/>зеленый</option>
			<option value="2.5"/>синий</option>
		</select>
		<p id="output"></p>
	</form>


</body>
</html>

laimas 19.06.2017 03:09

Цитата:

Сообщение от j0hnik
output.innerHTML = h.toFixed(2)

<output id="output"></output>

output.value = ....


Цитата:

Сообщение от j0hnik
height.value = h.toString();
width.value = w.toString();

А это зачем?

ФедорН 19.06.2017 09:37

j0hnik, laimas, спасибо

Цитата:

Сообщение от laimas (Сообщение 455875)
А это зачем?

Судя по тому что обсуждалось выше,это для того чтобы я инпут устанавливалось автоматически минимальное и максимальное значение при вводе юзером значения меньше/больше установленного

laimas 19.06.2017 10:12

Цитата:

Сообщение от ФедорН
это для того чтобы я инпут устанавливалось автоматически минимальное и максимальное ...

Вставляйте что душе угодно, но height.value = h, toString() тут совсем не нужен.

ФедорН 19.06.2017 13:34

laimas, понял. Спасибо

Сориентируйте ещё пожалуйста. Скрипт и форма располагаются просто на странице, если сделать так чтобы пользователь вводит цвет , размеры , видит стоимость , нажимает добавить ещё , появляется такая же строка , он вводит другой цвет, размеры и т.д. несколько раз. Потом он нажимает заказать , открывается попап форма для ввода телефона и комментария. В поле комментарий автоматом текстом вставляются цвет и размеры введённые ранее. Добавить ещё (это будет рекурсия? )и вставку введённых данных в существующую форму (как понимаю, инпуты и селект переменных нужно присвоить?) это сложно реализовать? Как понимаю, дополнительная работа с базой данных тут не нужна ? Т. К. данные автоматом при заказе уйдут мне на почту.

laimas 19.06.2017 13:40

Цитата:

Сообщение от ФедорН
ак понимаю, дополнительная работа с базой данных тут не нужна ? Т. К. данные автоматом при заказе уйдут мне на почту.

А что вы хотите получать почтой - мусор всякий или же все таки то, что есть в базе? А если действительно имеющееся, то нужна ли будет проверка данного в базе? А если нужна, то каким образом можно будет определить есть ли в базе, то есть вам формой прислали не мусор, если формой прислали кучу текста?


Часовой пояс GMT +3, время: 18:16.