Как вывести значение data-атрибута в поле input формы в модальном окне magnific-popup?

Question

На html-странице несколько карточек товара с кнопками "Заказать":

<div>
<h1>Название товара</h1>
<a class="popup-modal" data-product="Название товара" href="#modal">Заказать</a>
</div>
...

и одна форма отправки заказа, которая открывается в модальном окне magnific-popup:

<div id="modal" class="mfp-hide white-popup-block">
    <form id="feedback">
        <p><input type="hidden" id="product" name="Product" value=""></p>
        <p><input type="text" id="name" name="Имя" placeholder="Имя *" required></p>
        <p><input type="tel" id="phone" name="Телефон" placeholder="Телефон *" required></p>
        <p><button id="send" class="button">Отправить</button></p>
    </form>
</div>

За работу модального окна отвечает код:

$(function () {
    $('.popup-modal').magnificPopup();
});

Какой код и где именно дописать, чтобы в value скрытого input формы выводилось название товара?

<input type="hidden" id="product" name="Product" value="Название товара">

Это html, переменных нет.

Заранее благодарен

Answer 1

$(function () {
    $('.product').magnificPopup({});
    $('.product').bind('click', function() {
        var dataproduct = $(this).data('product');
        $('input#product').val(dataproduct);
    });
});

БЛОГ НА HUSL

Как вывести значение data-атрибута в поле input формы в модальном окне magnific-popup?

Ответы (1 шт):