Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Помогите написать скрипт 2 поля в text (https://javascript.ru/forum/dom-window/45925-pomogite-napisat-skript-2-polya-v-text.html)

web-expanse 21.03.2014 01:32

Помогите написать скрипт 2 поля в text
 
Доброго времени суток
Задача такова, нужно, что бы при заполнении input(1/2/3/4) и нажатии на кнопку "Рассчитать 1/2/3/4"
Все данные из этих 2ух полей переходили в другое поле(textarea)
Вот что уже есть: http://jsfiddle.net/WU3tZ/
т.е. вводим в поле, нажимаем кнопку и допустим в textarea появляется следующее: Рассчитать 1 (input1)

И еще, как сделать, что бы при нажатии на какую либо кнопку данные из этой кнопки попадали в textarea с новой строки
Сейчас сделано на половину, если первую строку нажать не первой, то тогда она станет в строку, или же если первой нажать 2/3/4 то тогда будет пустая строка вверху

Очень прошу помощи, заранее благодарен!

ksa 21.03.2014 08:39

web-expanse, с объяснениями у тебя просто провал... :D
Начнем с этого варианта

<!DOCTYPE html>
<html>
<head>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
function ok(Obj) {
	var o=document.getElementById('text');
	var dlm=(o.value=='')? '': '\n';
	o.value=o.value+dlm+Obj.value;
};
</script>
</head>
<body>
<form action = "" method = "post">
	<div>
		<input type="text" size="2" id="text1">  
		<input type="button" onclick="ok(this);" value = "Позиция 1" />
	</div>
	<div>
		<input type="text" size="2" id="text2">
		<input type="button" onclick="ok(this);" value = "Позиция 2" />
	</div>
	<div>
		<input type="text" size="2" id="text3">
		<input type="button" onclick="ok(this);" value = "Позиция 3" />
	</div>
	<div>
		<input type="text" size="2" id="text4">
		<input type="button" onclick="ok(this);" value = "Позиция 4" />
	</div>
	<div>
	<textarea id="text" value = "" rows="10" /></textarea>
</form>
</body>
</html>

web-expanse 21.03.2014 09:55

Цитата:

Сообщение от ksa (Сообщение 303535)
web-expanse, с объяснениями у тебя просто провал... :D
Начнем с этого варианта

<!DOCTYPE html>
<html>
<head>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
function ok(Obj) {
	var o=document.getElementById('text');
	var dlm=(o.value=='')? '': '\n';
	o.value=o.value+dlm+Obj.value;
};
</script>
</head>
<body>
<form action = "" method = "post">
	<div>
		<input type="text" size="2" id="text1">  
		<input type="button" onclick="ok(this);" value = "Позиция 1" />
	</div>
	<div>
		<input type="text" size="2" id="text2">
		<input type="button" onclick="ok(this);" value = "Позиция 2" />
	</div>
	<div>
		<input type="text" size="2" id="text3">
		<input type="button" onclick="ok(this);" value = "Позиция 3" />
	</div>
	<div>
		<input type="text" size="2" id="text4">
		<input type="button" onclick="ok(this);" value = "Позиция 4" />
	</div>
	<div>
	<textarea id="text" value = "" rows="10" /></textarea>
</form>
</body>
</html>

Пол задачи сделано, спасибо!
С объяснением да, чутка туговато:D

web-expanse 21.03.2014 10:00

Поясню вторую часть, если еще кто-то не понял:)
При заполнении одного из полей и нажатии кнопки возле этого поля данные должны помещаться в textarea, сейчас данные помещаются только из кнопки
Рассмотрим на примере первого поля и первой кнопки
При заполнения поля(пускай это будет "Слово") мы нажимаем на кнопку которая стоит рядом
После этого в textarea появляется следующее: Позиция 1 (Слово)

Буду благодарен за помощь!

ksa 21.03.2014 11:39

Цитата:

Сообщение от web-expanse
При заполнения поля(пускай это будет "Слово") мы нажимаем на кнопку которая стоит рядом
После этого в textarea появляется следующее: Позиция 1 (Слово)

Как вариант...

<!DOCTYPE html>
<html>
<head>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
function ok(Obj) {
	var val=Obj.parentNode.getElementsByTagName('input')[0].value;
	var o=document.getElementById('text');
	var dlm=(o.value=='')? '': '\n';
	o.value=o.value+dlm+Obj.value+' ('+val+')';
};
</script>
</head>
<body>
<form action = "" method = "post">
	<div>
		<input type="text" size="2" id="text1">  
		<input type="button" onclick="ok(this);" value = "Позиция 1" />
	</div>
	<div>
		<input type="text" size="2" id="text2">
		<input type="button" onclick="ok(this);" value = "Позиция 2" />
	</div>
	<div>
		<input type="text" size="2" id="text3">
		<input type="button" onclick="ok(this);" value = "Позиция 3" />
	</div>
	<div>
		<input type="text" size="2" id="text4">
		<input type="button" onclick="ok(this);" value = "Позиция 4" />
	</div>
	<div>
	<textarea id="text" value = "" rows="10" /></textarea>
</form>
</body>
</html>

web-expanse 21.03.2014 11:46

Большое вам спасибо!

web-expanse 21.03.2014 14:52

К сожалению нужны доработки:)
Функции те же, но реализация иная нужна
html код примерно следующего образа:
<!DOCTYPE html>
<html>
<head>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
function ok(Obj) {
	var o=document.getElementById('text');
	var dlm=(o.value=='')? '': '\n';
	o.value=o.value+dlm+Obj.value;
};
</script>
</head>
<body>
<form action = "" method = "post">
	<div>
		<p>Наименование 1</p>
		<input type="text" size="2" id="text1">  
		<input type="button" onclick="ok(this);" value = "Заказать" />
	</div>
	<div>
		<p>Наименование 2</p>
		<input type="text" size="2" id="text2">
		<input type="button" onclick="ok(this);" value = "Заказать" />
	</div>
	<div>
		<p>Наименование 3</p>
		<input type="text" size="2" id="text3">
		<input type="button" onclick="ok(this);" value = "Заказать" />
	</div>
	<div>
		<p>Наименование 4</p>
		<input type="text" size="2" id="text4">
		<input type="button" onclick="ok(this);" value = "Заказать" />
	</div>
	<div>
</form>
<form action = "" method = "post">
	<textarea id="text" value = "" rows="10" /></textarea>
</form>
</body>
</html>

строку "Наименование 1/2/3/4" и заполненный input нужно при нажатии кнопки "Заказать" помещать в другую форму в поле textarea

P.S. к любому из полей можно задать id
:help:

web-expanse 21.03.2014 22:46

Прошу помощи


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