Передаем значение полей из одной формы в другую на странице ресурса с помощью jQuery

У нас есть 2 формы и кнопка «Передать значения», по нажатию на которую будет происходить передача значений во вторую форму.

Для этого достаточно следующей функции:

$('.btn').click(function(){
  $('#form-2 [name="name"]').val($('#form-1 [name="name"]').val());
  $('#form-2 [name="surname"]').val($('#form-1 [name="surname"]').val());
});

Где «.btn» — это класс кнопки, по нажатию на которую срабатывает функция,

«#form-1» и «#form-2» — id форм,

«name» и «surname» — поля формы, значения которой должны переноситься во вторую форму

Данные одной формы передаются в другую, путем присвоения значения выбранного поля в нашем случае input&

Пример готового решения

Заполните поля «Name» и «Surname» и нажмите кнопку «Передать значения»


<form id="form-1">
<label style="margin-right: 30px;"> Name
	<input type="text" class="name" name="name" />
</label>
<label>Surname
<input type="text" class="surname" name="surname" />
</label>
</form>
<button class="btn" type="button">Передать значения</button>
<br />
<form id="form-2">
<label style="margin-right: 30px">Name<input type="text" class="name" name="name" /></label>
<label style="margin-right: 30px">Surname<input type="text" class="surname" name="surname" /></label>
<label style="margin-right: 30px">Email<input type="text" class="e-mail" name="e-mail" /></label>

</form>
<script>
$('.btn').click(function(){
  $('#form-2 [name="name"]').val($('#form-1 [name="name"]').val());
  $('#form-2 [name="surname"]').val($('#form-1 [name="surname"]').val());
});
</script>
Рубрики: js