Показать сообщение отдельно
  #1 (permalink)  
Старый 14.08.2018, 14:07
Аспирант
Отправить личное сообщение для desperate_one Посмотреть профиль Найти все сообщения от desperate_one
 
Регистрация: 21.04.2017
Сообщений: 43

Передача данных из карточки в popup форму
Есть карточки товаров, грубо выглядят так:
<div class="cart" id="1">
 <h3>Пицца пепперони</h3>
 <img src="1.png" height="150px">
 <p class="desc">Состав пиццы</p>
 <p class="selects">
    <span class="ves">450 гр.</span>
    <span class="testo">
                    <b>Размер:</b> M
    </span>
 </p>
 <p class="cena">500 руб.</p>
  <div class="order-form-go btn">Заказать</div>
</div>
<div class="cart" id="2">
 <h3>Пицца Маргарита</h3>
 <img src="2.png" height="150px">
 <p class="desc">Состав пиццы 2</p>
 <p class="selects">
    <span class="ves">320 гр.</span>
    <span class="testo">
                    <b>Размер:</b> S
    </span>
 </p>
 <p class="cena">370 руб.</p>
  <div class="order-form-go btn">Заказать</div>
</div>


есть попап форма в которую должны передаваться данные выбранной пиццы по клику на кнопку "Заказать":

<div id="modal-form">
        <span id="modal_close">X</span>
        <form action="" method="post">
            <h3>Оформление заказа</h3>
            <hr>
            <h4>Название товара</h4>
            <img src="картинка карточки" height="50px" align="left">
            <br>
            <p>описание карточки</p>
            <p>
                <span>
                    <b>Вес:</b> ? гр.
                </span>
                <span>
                    <b>Размер:</b> ?
                </span>
            </p>
            <p>
                <b>Цена:</b> ? руб.
            </p>
            <input name="order_go" type="submit" value="ОТПРАВИТЬ">
        </form>
    </div>
<div id="overlay"></div><!-- Пoдлoжкa -->


Скрипт показа/скрытия попапа:
<script>
    $(document).ready(function() {
	$('div.order-form-go').click( function(event){
		event.preventDefault(); // выключaем стaндaртную рoль элементa
		$('#overlay').fadeIn(400, // снaчaлa плaвнo пoкaзывaем темную пoдлoжку
		 	function(){ // пoсле выпoлнения предъидущей aнимaции
				$('#modal-form') 
					.css('display', 'block') // убирaем у мoдaльнoгo oкнa display: none;
					.animate({opacity: 1}, 200); // плaвнo прибaвляем прoзрaчнoсть oднoвременнo сo съезжaнием вниз
		});
	});
	/* Зaкрытие мoдaльнoгo oкнa, тут делaем тo же сaмoе нo в oбрaтнoм пoрядке */
	$('#modal_close, #overlay').click( function(){ // лoвим клик пo крестику или пoдлoжке
		$('#modal-form')
			.animate({opacity: 0}, 200,  // плaвнo меняем прoзрaчнoсть нa 0 и oднoвременнo двигaем oкнo вверх
				function(){ // пoсле aнимaции
					$(this).css('display', 'none'); // делaем ему display: none;
					$('#overlay').fadeOut(400); // скрывaем пoдлoжку
				}
			);
	});
});
    </script>

Вывод попапа сделал, но не знаю как динамически передать данные из карточки в попап, помогите решить проблемку.
Ответить с цитированием