Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.12.2013, 19:59
Профессор
Отправить личное сообщение для Batyabest Посмотреть профиль Найти все сообщения от Batyabest
 
Регистрация: 14.09.2013
Сообщений: 252

Обновление значений в документе по нажатию кнопки
Здравствуйте.
По нажатию внопки добавляется динамически блок с определенным содержимым. Как сделать чтобы при повторном нажатии кнопки содержимое обновлялось а не добавлялось еще раз?

function someFunc(){
var quantity = document.getElementById("quantity").value; // Объявляем переменную равную значению введенному в поле количество
	function empty_form ()
	{
		var quantity = document.getElementById('quantity').value;
		if(quantity == '')
		{
			alert('Вы забыли ввести текст.');
			return false;
		}    
		return true;
	}
var price = quantity * 9000; // Объявляем переменную равную общей стоимости (кол-во * цену одного товара)
var tovar = document.getElementsByTagName('span')[0].innerHTML; // Получаем доступ к содержимому элемента <span> с названием цвета товара
var totalprice = price;
var div = document.createElement("div"); // Создаем элемент div
div.innerHTML = "<h3>Ваша заявка:<\/h3>\n <p>"+tovar+" "+price+" руб.</p>\n <p>Итого: "+totalprice+" руб.</p>"; // Наполняем созданный div содержанием с подстановкой значения price
document.getElementById("zayavka").appendChild(div); // Все вкладывается в <div id=zayavka></div>
return false;
//alert(tovar);
}


<form>
	<table id="zakazTable">
		<tr>
			<td><span>Венге</span></td>
			<td>
				<input type="text" value="" id="quantity" >
				<input type="button" value="Заказать" id="zakazat" onclick="someFunc()">
			</td>
		</tr>
	</table>
<div id="zayavka"></div>
</form>
Ответить с цитированием
  #2 (permalink)  
Старый 09.12.2013, 02:20
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Вместо создания div'а сразу устанавливай zayavka.innerHTML .
Таким образом при каждом вызове будет перетираться содержимое div#zayavka
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 09.12.2013, 08:15
Профессор
Отправить личное сообщение для Batyabest Посмотреть профиль Найти все сообщения от Batyabest
 
Регистрация: 14.09.2013
Сообщений: 252

Спасибо, получилось!!!
Теперь я хочу добавить товаров в форму (из планируется 3 штуки).
Делаю разметку такой:
<form>
	<table id="zakazTable">
		<tr>
			<td><span>Венге</span></td>
			<td>
				<input type="text" value="" id="quantity">
				<input type="button" value="Заказать" id="zakazat" onclick="someFunc()">
			</td>
		</tr>
		<tr>
			<td><span>Орех гварнери</span></td>
			<td>
				<input type="text" value="" id="quantity">
				<input type="button" value="Заказать" id="zakazat" onclick="someFunc()">
			</td>
		</tr>
		<tr>
			<td><span>Клен медисон</span></td>
			<td>
				<input type="text" value="" id="quantity">
				<input type="button" value="Заказать" id="zakazat" onclick="someFunc()">
			</td>
		</tr>
	</table>
<div id="zayavka"></div>
</form>

Код JS согласно внесенным изменениям:
function someFunc(){
var quantity = document.getElementById("quantity").value; // Объявляем переменную равную значению введенному в поле количество
var price = quantity * 9000; // Объявляем переменную равную общей стоимости (кол-во * цену одного товара)
var tovar = document.getElementsByTagName('span')[0].innerHTML; // Получаем доступ к содержимому элемента <span> с названием цвета товара
var totalprice = price;
document.getElementById("zayavka").innerHTML = "<h3>Ваша заявка:<\/h3>\n <p>"+tovar+" "+price+" руб.</p>\n <p>Итого: "+totalprice+" руб.</p>";;
//var div = document.createElement("div"); // Создаем элемент div
//div.innerHTML = "<h3>Ваша заявка:<\/h3>\n <p>"+tovar+" "+price+" руб.</p>\n <p>Итого: "+totalprice+" руб.</p>"; // Наполняем созданный div содержанием с подстановкой значения price
 // Все вкладывается в <div id=zayavka></div>
return false;
//alert(tovar);

}


проблема в том, что теперь по нажатию Заказать у 2 или 3 товара, функция не срабатывает либо отрабатывает значение первого товара. В чем может быть проблема?

Последний раз редактировалось Batyabest, 09.12.2013 в 08:22.
Ответить с цитированием
  #4 (permalink)  
Старый 09.12.2013, 13:30
Аватар для lord2kim
Профессор
Отправить личное сообщение для lord2kim Посмотреть профиль Найти все сообщения от lord2kim
 
Регистрация: 03.05.2011
Сообщений: 848

Batyabest, для начала попровьте id-ентификаторы...это индивидуальные значения для каждого элемента в пределах одной html-страницы...
а у вас 3 элемента c id = quantity (про элементы zakazat молчу...)
Ответить с цитированием
  #5 (permalink)  
Старый 10.12.2013, 12:04
Профессор
Отправить личное сообщение для Batyabest Посмотреть профиль Найти все сообщения от Batyabest
 
Регистрация: 14.09.2013
Сообщений: 252

<p><b><span style="color: blue">Услуги по доставке</span></b></p>
<input type="radio" name="dostavka" value="Нижний Новгород (нижняя часть города) в течение 5 дней"><span> г. Нижний Новгород (нижняя часть города) в течение 5 дней 300 руб.</span><br>
<input type="radio" name="dostavka" value="г. Нижний Новгород (верхняя часть города) в течение 5 дней"><span> г. Нижний Новгород (верхняя часть города) в течение 5 дней 400 руб.</span><br>
<input type="radio" name="dostavka" value="г. Нижний Новгород (верхняя и нижняя часть города) на следующий день после оформления"><span> г. Нижний Новгород, срочная (верхняя и нижняя часть города) на следующий день после оформления! 800 руб.</span><br>
<input type="radio" name="dostavka" value="Нижегородская область до 30 км. в течение 5 дней"><span> Нижегородская область до 30 км. в течение 5 дней 1500 руб.</span><br>
<input type="radio" name="dostavka" value="За пределами Н.Новгорода от 30 км. (на круг) 14 руб./км"><span> За пределами Н.Новгорода от 30 км. (на круг) 14 руб./км</span><br>
<input type="radio" name="dostavka" value="Транспортной компанией"><span> Транспортной компанией: с тарифами доставки Вы можете  ознакомится:  <a href="http://www.pecom.ru/ru/calc/">ТК ПЭК</a>, <a href="http://www.dellin.ru/">ТК Деловые Линии</a>. Вес упаковки стола с механизмом составляет 40килограм.(2места). Вся мебель поставляется в разобранном виде в плоских упаковках.</span>
<p><b><span style="color: blue">Услуги по подъему на этаж</span></b></p>
<input type="radio" name="podyem">
<span> Подъем стола-транформера в квартиру 100 руб./этаж на </span><input type="text" name="etazh" size=3>
<input type="radio" name="podyem"><span> Подъем стола-транформера на лифте</span>


Добавил в разметку этот код. Мне нужно чтобы при выборе радио кнопок цена в заявке менялась "согласно тарифам")) А при выборе за пределами Нижнего Новгорода и Транспортной компанией - отображалось строкой в заяявке "мы уточним стоимость". Ну и чтобы поле введенное в этаж пересчитаалос с общим количеством и умножалось на цену и также добавлялось в заявку и в Итого.

Помогите решить проблему...

Последний раз редактировалось Batyabest, 10.12.2013 в 12:20.
Ответить с цитированием
  #6 (permalink)  
Старый 10.12.2013, 14:33
Аватар для lord2kim
Профессор
Отправить личное сообщение для lord2kim Посмотреть профиль Найти все сообщения от lord2kim
 
Регистрация: 03.05.2011
Сообщений: 848

Batyabest,

<script>
var d = document, amount, lift, price_floor = 100;

window.onload = function () {
	d.getElementById("main").onclick = function (e) {
		var target = e && e.target || event.srcElement;
		
		if (target.tagName == "INPUT" && target.name == "podyem") return summ();
		
		if (target.tagName == "INPUT" && target.name == "dostavka") {
			amount = target.value;
		}
		summ();
	};
	
	d.getElementById("etazh").onkeyup = function () {
		lift = parseInt(d.getElementById("etazh").value);
		summ();
	};
}

function summ() {
	d.getElementById("clarify").style.display = amount == 0 ? "block" : "none";
	d.getElementById("delivery").innerHTML = amount == undefined ? 0 : amount;
	d.getElementById("lifting").innerHTML = (d.getElementById("wo_lift").checked ? parseInt(lift) : 0)+" * "+price_floor;
	d.getElementById("sum").innerHTML = parseInt((amount == undefined ? 0 : amount)) + parseInt((d.getElementById("wo_lift").checked ? (lift == undefined ? 0 : lift) : 0))*price_floor;
}
</script>
<div id="main">
<p><b><span style="color: blue">Услуги по доставке</span></b></p>
<input type="radio" name="dostavka" value="300"><span> г. Нижний Новгород (нижняя часть города) в течение 5 дней 300 руб.</span><br>
<input type="radio" name="dostavka" value="400"><span> г. Нижний Новгород (верхняя часть города) в течение 5 дней 400 руб.</span><br>
<input type="radio" name="dostavka" value="800"><span> г. Нижний Новгород, срочная (верхняя и нижняя часть города) на следующий день после оформления! 800 руб.</span><br>
<input type="radio" name="dostavka" value="1500"><span> Нижегородская область до 30 км. в течение 5 дней 1500 руб.</span><br>
<input type="radio" name="dostavka" value="0"><span> За пределами Н.Новгорода от 30 км. (на круг) 14 руб./км</span><br>
<input type="radio" name="dostavka" value="0"><span> Транспортной компанией: с тарифами доставки Вы можете  ознакомится:  <a href="http://www.pecom.ru/ru/calc/">ТК ПЭК</a>, <a href="http://www.dellin.ru/">ТК Деловые Линии</a>. Вес упаковки стола с механизмом составляет 40килограм.(2места). Вся мебель поставляется в разобранном виде в плоских упаковках.</span>
<p><b><span style="color: blue">Услуги по подъему на этаж</span></b></p>
<input type="radio" name="podyem" id="wo_lift">
<span> Подъем стола-транформера в квартиру 100 руб./этаж на </span><input type="text" id="etazh" size=3>
<input type="radio" name="podyem"><span> Подъем стола-транформера на лифте</span><br>
<span>Итого: доставка <span id="delivery">0</span>&nbsp;+&nbsp;подъем <span id="lifting">0 * 100</span>&nbsp;=&nbsp;<span id="sum">0</span>&nbsp;<span id="clarify" style="display: none;">мы уточним точную стоимость</span></span></div>


P.S.: зря плодите море тем...
Ответить с цитированием
  #7 (permalink)  
Старый 10.12.2013, 18:21
Профессор
Отправить личное сообщение для Batyabest Посмотреть профиль Найти все сообщения от Batyabest
 
Регистрация: 14.09.2013
Сообщений: 252

Я хотел достучаться до Вас в личку. Уж больно Вы мне хорошо помогаете. Не скинете свои координаты?
Ответить с цитированием
  #8 (permalink)  
Старый 10.12.2013, 21:33
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Batyabest
Я хотел достучаться до Вас в личку. Уж больно Вы мне хорошо помогаете. Не скинете свои координаты?
Перефразирую:

Цитата:
Вы мне хорошо помогаете. Я думаю вы должны помогать мне еще больше. Не скинете свои координаты?
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #9 (permalink)  
Старый 10.12.2013, 21:43
Аватар для lord2kim
Профессор
Отправить личное сообщение для lord2kim Посмотреть профиль Найти все сообщения от lord2kim
 
Регистрация: 03.05.2011
Сообщений: 848

Сообщение от danik.js Посмотреть сообщение
Перефразирую:
)))
Ответить с цитированием
  #10 (permalink)  
Старый 11.12.2013, 17:24
Профессор
Отправить личное сообщение для Batyabest Посмотреть профиль Найти все сообщения от Batyabest
 
Регистрация: 14.09.2013
Сообщений: 252

Сообщение от danik.js Посмотреть сообщение
Перефразирую:
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Отправка файла с фиксированым местоположением по нажатию кнопки greencard AJAX и COMET 16 17.07.2013 14:22
Вызов сценария php по нажатию кнопки с передачей параметра Allan Stark ExtJS 2 09.10.2012 11:50
Обновление события кнопки TheHappy Общие вопросы Javascript 0 06.03.2012 08:30
Обновление поля вместе с кнопкой,при нажатию на которую происходит обновление тома AJAX и COMET 8 26.11.2009 09:47
Переодическое обновление значений для графика, функция для обновления значений yupa87 Общие вопросы Javascript 0 09.07.2009 13:48