Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.02.2014, 15:42
Новичок на форуме
Отправить личное сообщение для Joliat Посмотреть профиль Найти все сообщения от Joliat
 
Регистрация: 03.10.2013
Сообщений: 7

Суммирование значений по всем динамически добавленным полям
Добрый день. Сразу скажу, что я очень слабо разбираюсь в JS, но стараюсь из всех сил.
Передо мной стала задача: сделать суммирование значений по всем динамически добавленным полям.
У меня есть механизм динамического создания двух input полей и расчет сложения значений из них с выводом в span. Поля имеют ID item5 и itemm5, а span - result5, где 5 - номер динамически добавленной строки с полями.
Т.е. грубо говоря, выглядит это так:
[2]+[2] = 4 (id элементов в окончании имеют "1")
[2]+[3] = 5 (id элементов в окончании имеют "2")
[1]+[1] = 2 (id элементов в окончании имеют "3")
и т.д.
Мне нужно произвести подсчет значений из input item и span.
Как это сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 12.02.2014, 15:54
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Какая разница че какие у них айдишники
Ты просто когда создаешь их - складывай в массивчик.
А когда нужно - пройдись по массивчику и просуммируй свойства .value инпутов. Вобще до конца не понял че ты там мутишь. Показывай пример что-ли.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 12.02.2014, 16:01
Новичок на форуме
Отправить личное сообщение для Joliat Посмотреть профиль Найти все сообщения от Joliat
 
Регистрация: 03.10.2013
Сообщений: 7

Да, как понимаю про массив Вы правы. Я не знаю как его реализовать. ID я привел для того, чтоб стало понятно какая закономерность их создания.
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<script language="javascript">
		var items=1;
		function AddItem() {
			var div=document.getElementById("items");
			var button=document.getElementById("add");
			items++;
			var newitem="<strong>Поле " + items + ": </strong>";
			newitem+="<select onchange=\"calc(" + items + ")\" name='select_name" + items + "' id='select_name" + items + "'>";
			newitem+="<option value='1'>один";
			newitem+="<option value='2' selected='selected'>два";
			newitem+="<option value='3'>три";
			newitem+="</select>"; 
			var newitemm="<strong> Поле_ " + items + ": </strong>";
			newitemm+="<input value=\"3\" onchange=\"calc(" + items + ")\" type=\"text\" name=\"itemm" + items +"\" id =\"itemm" + items +"\" size=\"45\">";
			newitemm+="Стоимость: <span id=\"result" + items + "\">0</span> руб.";
			newnode=document.createElement("div");
			newnode.id = "item_" + items;
			newnode.innerHTML=newitem+newitemm;
			div.insertBefore(newnode,button);
            var strok = document.getElementById("strok"); //получаем ссылку на элемент span, в него будем писать количество всех строк
            var strokk = items;
            strok.innerHTML = strokk;
			
		}

        function calc(t) {
            var type_design = document.getElementById("select_name" + t); //получаем ссылку на элемент Select 
            var count = document.getElementById("itemm" + t); //получаем ссылку на элемент input
            var result = document.getElementById("result" + t); //получаем ссылку на элемент span, в него будем писать стоимость одной строки
            var resultitog = document.getElementById("resultitog"); //получаем ссылку на элемент span, в него будем писать стоимость всех строк

            var price = 0;
            var priceitog = 0;
            price += parseInt(type_design.options[type_design.selectedIndex].value);
            price = price + parseInt(count.value);
			
            
            result.innerHTML = price;
            resultitog.innerHTML = priceitog;
        }

        </script>
</head>
<body>
<form method="post" action="/calc.php?=send">
<div ID="items">
<div id="item_2">
	<strong>Поле 1: </strong>
	<select id="select_name1" name="select_name1" onchange="calc(1)">
		<option value="1">один</option>
		<option selected="selected" value="2">два</option>
		<option value="3">три</option>
	</select>
	<strong>Поле_ 1: </strong>
	<input id="itemm1" type="text" size="45" name="itemm1" onchange="calc(1)" value="3">
	Стоимость: <span id="result1">4</span>руб.
</div>
<input type="button" value="Добавить поле" onClick="AddItem();" ID="add">
</div>
<input type="submit" value="Отправить" name="submit">
</form>
        <div>Всего строк: <span id="strok">1</span> руб.</div>
        <div>Всего значения по input: <span id="summainput">1</span> руб.</div>
        <div>Стоимость заказа: <span id="resultitog">0</span> руб.</div>

</body>
</html>

Последний раз редактировалось Joliat, 12.02.2014 в 16:05. Причина: добавление кода
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Суммирование значений полей BLP Элементы интерфейса 6 05.11.2012 12:43
Суммирование значений всех элементов div frolvict jQuery 1 11.07.2011 17:05
суммирование значений двух текстовых инпутов при заполнении dolben Общие вопросы Javascript 4 19.08.2010 12:36