Показать сообщение отдельно
  #1 (permalink)  
Старый 28.05.2019, 11:09
Интересующийся
Отправить личное сообщение для eLDeR Посмотреть профиль Найти все сообщения от eLDeR
 
Регистрация: 28.05.2019
Сообщений: 23

Форма внутри формы
Доброго времени суток, господа. Помогите реализовать задуманное.

Есть Код JS
$(function() {
		$("#form_status_added").click(function () {
		var elemCount = document.getElementsByClassName('param').length + 1;
			$("<div class='param mt-3'><div class='row'><div class='col-12'><div class='alert alert-primary text-center' id='totals'><strong>"+elemCount+"</strong></div></div><div class='col-12'><textarea rows='5' class='form-control mb-3' type='text' name='rabota"+elemCount+"[]' placeholder='Наименование видов работ'></textarea></div></div></div><div class='row'><div class='col-12 mb-2 text-center'><strong>Материал</strong></div></div><div class='row' id='mater"+elemCount+"'><div class='col-8'><input class='form-control mb-3' type='text' name='mater_name"+elemCount+"[]' placeholder='Название'></div><div class='col-2'><input class='form-control mb-3' type='text' name='mater_units"+elemCount+"[]' placeholder='Количество'></div><div class='col-2'><input class='form-control mb-3' type='text' name='mater_price"+elemCount+"[]' placeholder='Цена за ед.'></div></div><div class='row' id='nextmater"+elemCount+"'><div class='col-12'><input class='btn btn-primary btn-lg btn-block' type='button' value='Добавить Материал' id='form_"+elemCount+"'></div></div><div class='row'><div class='col-12'><hr></div></div>" ).insertBefore("#next");
			document.getElementById('total').value = elemCount;
		});
	 });
	$(function() {
		$("form_1").click(function () {
			$("<div class='row' id='mater1'><div class='col-8'><input class='form-control mb-3' type='text' name='mater_name1[]' placeholder='Название'></div><div class='col-2'><input class='form-control mb-3' type='text' name='mater_units1[]' placeholder='Количество'></div><div class='col-2'><input class='form-control mb-3' type='text' name='mater_price1[]' placeholder='Цена за ед.'></div></div>" ).insertBefore("#nextmater1");
		});
	 });

$(document).ready(function () {
	var elemtotal = document.getElementsByClassName('param').length;
	document.getElementById('total').value = elemtotal;
});

Код HTML
<div class="param mt-3">
			<div class="row">
			<div class="col-12"><div class="alert alert-primary text-center" id="totals"><strong>1</strong></div></div>
				<div class="col-12"><textarea rows="5" class="form-control mb-3" type="text" name="rabota1[]" placeholder="Наименование видов работ"></textarea></div>
			</div>
			<div class="row">
				<div class="col-12 mb-2 text-center"><strong>Материал</strong></div>
			</div>

			<div class="row" id="smeta_mater1">
				<div class="col-8"><input class="form-control mb-3" type="text" name="smeta_mater_name1[]" placeholder="Название"></div>
				<div class="col-2"><input class="form-control mb-3" type="text" name="smeta_mater_units1[]" placeholder="Количество"></div>
				<div class="col-2"><input class="form-control mb-3" type="text" name="smeta_mater_price1[]" placeholder="Цена за ед."></div>
			</div>
			<div class="row" id="nextmater1">
				<div class="col-12">
					<input id="form_1" class="btn btn-primary btn-lg btn-block" type="button" value="Добавить Материал">
				</div>
			</div>
			<div class="row"><div class="col-12"><hr></div></div>
		</div>
		<div class="row" id="next">
			<div class="col-6">
				<input class="btn btn-primary btn-lg btn-block" type="button" value="Добавить поле" id="form_status_added">
			</div>
			<div class="col-6">
				<input type="hidden" name="total" id="total" value="">
				<button name="updates" class="btn btn-primary btn-lg btn-block">Обновить</button>
			</div>
		</div>


Так вот. Это добавление внутри добавления.
Примерно визуализированное
https://jsfiddle.net/069fojyx/

Не работает #form_1

И как написать скрипт для всего добавленного по полю #form_status_added
Ответить с цитированием