@s1mypj
Начинающий web-программист.

Как записать динамические данные в переменную?

Добрый день, я снова с вопросом именно к вам.
На JS - начал работать не так давно, хотелось бы узнать, есть ли возможность записывать данные в переменную, скорее всего в массив, не совсем понимаю как это работает.
В общем есть код модалки, куда должны падать товары
<div class="card">
	<div class="image_wrapper">
		<img src="/images/buggi/1.jpg" class="image" alt="buggi">
		<img src="/images/buggi/2.jpg" class="other_image" alt="buggi">
	</div>
	<div class="product_info">
		<div class="product_title">
			<h2 data-art="Y1-291-BLUE">Коляска-трансформер BaoBaoHao Y1-291-BLUE</h2>
		</div>
		<div class="product_description">
			<p>Производитель: <span>BaoBaoHao</span></p>
			<p>Комплект: <span>Коляска-трансформер, москитная сетка, корзина для багажа.</span></p>
			<p class="desc">Складывается до размеров ручной клади в самолет, отделение для перевозки вещей, пятиточечный ремень безопасности, 4 амортизатора, съемные колеса, складывание одной рукой, откидной бампер, дополнительное увеличение длины козырька, окошко для наблюдения за ребенком.</p>
		</div>
		<div class="product_cost">
			<p data-cost-id="1">4 144 р.</p>
		</div>
	</div>
</div>
<div class="placeOrder">
	<div class="orderBg"></div>
	<div class="close"><span></span><span></span></div>
	<div class="inner_wrapper">
		<div class="order_info">
			<div class="order_title">
				<h2>Ваш заказ</h2>
			</div>
			<div class="prev_buggy">
				<div class="image_wrapper"><img src="" alt="previmg"></div>
				<div class="buggy_name">
					<p></p>
					<span class="article"></span>
				</div>
				<div class="count">
					<p>1</p>
					<span class="minus">-</span><span class="plus">+</span>
				</div>
				<div class="cost">
					<p data-count='4144'>4 144</p>
					<span class="delete"></span>
				</div>
			</div>
			<div class="total_cost">
				<p class="cost">Сумма:  4 144 р.</p>
			</div>
		</div>
		<div class="form_wrapper">
			<form method="POST">
				<input type="hidden" class="buggy_name">
				<input type="hidden" class="buggy_art">
				<input type="hidden" class="buggy_cost">
				<input type="hidden" value="1" class="buggy_count">
				<label for="">
					<span>Ваше имя</span>
					<input type="text" name="name">
				</label>
				<label for="">
					<span>Ваш Email</span>
					<input type="mail" name="email">
				</label>
				<label for="">
					<span>Ваш телефон</span>
					<input type="tel" name="tel">
				</label>
				<button>Оформить заказ</button>
			</form>
		</div>	
	</div>
</div>

Обработчик может быть кривой, но какой написал...
$('.card').click(function(event) {
		var imageURLMain = $(this).children().children().attr('src');
		var titleCard = $(this).children().next().children().children('h2').text();
		var art =  $(this).children().next().children().children().data('art');
		var cost = $(this).children().next().children('.product_cost').text();
		var desc = $(this).children().next().children().children('.desc').text();
		$('.placeOrder .prev_buggy .image_wrapper img').attr('src', imageURLMain);
		$('.placeOrder .prev_buggy .buggy_name p').html(titleCard);
		$('.placeOrder .prev_buggy .buggy_name span').html('Артикул: '+art);
		$('.placeOrder .prev_buggy .cost p').html(cost);
		$('.placeOrder .total_cost p').html('Сумма:  '+cost);
		$('.placeOrder .prev_buggy .cost p').data('cost', cost);
		$('.buy_buggy .info p.desc').html(desc);
		$('input.buggy_name').val(titleCard);
		$('input.buggy_art').val(art);
		$('input.buggy_cost').val(cost);
	});

Сейчас при клике на карточку(.card) в модалке создаётся один товар, по которому мы кликнули.
Нужно сделать так, чтобы данные о товаре записывались в массив и сохранялись, чтобы при клике этот товар не обновлялся, а вниз добавлялся ещё один - новый товар.
Ну и желательно, чтобы создавалось ещё 4 инпута, где уже будут новые данные о втором товаре, это для отправки на почту.
Знаю, что лучше подключить какой-нибудь woocommerce, но клиент привык делать так и хочет, чтобы оставалось так же.
Заранее спасибо, за предложенные варианты.
  • Вопрос задан
  • 49 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы