Задать вопрос
iamfedorov
@iamfedorov
SEO правит миром!

Как правильно вывести data-атрибуты в модальном окне bootstrap?

Есть две ссылки вида:
<a href="#popup-zakaz-form" class="btn btn-line dark btn-xs popup-contact" data-bname="Букет «Весна»" data-bimg="images/buket/2.jpg" data-bprice="580" >Заказ</a>

<a href="#popup-zakaz-form" class="btn btn-line dark btn-xs popup-contact" data-bname="Букет «Лето»" data-bimg="images/buket/3.jpg" data-bprice="280" >Заказ</a>


При клике на них открывается всплывающее окно заказа. Окно открывается и все работает, вопрос заключается в том, чтоб не клонировать кучу окон с параметрами для каждого товара, а сделать при этом одну форму всплывающего окна, а необходимые параметры передать в дата-атрибутах и выводить их с помощью jquery. Сделал форму, но почему-то ничего не работает:
Код самого окна:
<!-- Popup contact form -->
	<div id="popup-zakaz-form" class="white-popup-block popup-form mfp-hide">
		<div class="pop-header">
			<i class="fa fa-thumbs-o-up"></i>
			<h3 class="title medium">ОФОРМИТЬ ЗАКАЗ</h3>
		</div>
		
		<div style="background-color: rgb(255, 255, 255); margin-right: 0px; margin-left: 0px;" class="row">
			<div class="col-md-6">
				<div id="blc">y</div>
			</div>
			<div class="col-md-6">
				<div class="pop-body">
					<form action="form-data/formdata.php" class="form-widget" data-popup="popup-contact">
						<input type="hidden" name="to" value="r.genesis.art@gmail.com">
						<input class="form-control" data-label="Name" required data-msg="Пожалуйста, введите ваше имя." type="text" name="name" placeholder="Ваше имя">
						<input class="form-control"  data-label="Phone" required data-msg="Пожалуйста, введите ваш номер телефона." type="text" name="phone" placeholder="Ваш номер телефона">
						<button type="submit" class="btn btn-primary"><i class="fa fa-envelope-o"></i> ЗАКАЗАТЬ</button>
					</form>	
					<div class="msg-block"></div>
				</div>
		
		<script>
		var bimg = $('a').data('bimg');
		var bname = $('a').data('bname');
		var bprice = $('a').data('bprice');
		
		$( '#blc' ).html( '<div class="img"><img style="width: 100%;" src="'+ bimg +'" alt="оформление заказа"></div><h3 class="hd"> ' + bname + ' </h3>' );
		</script>
		    </div>
		</div>
	</div><!-- /#popup-contact-form -->


Подозреваю, что не правильно оформил ява код, помогите, пожалуйста с решением данного вопроса!
  • Вопрос задан
  • 692 просмотра
Подписаться 1 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 1
@WapGeaR
Программист
Вы вызываете данные из первого попавшегося "a", задайте для a id и вызвайте через $("#someId").data
Ответ написан
Ваш ответ на вопрос

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

Похожие вопросы