Как передать данные товара в popup?

Question

[Никита]

Как передать данные товара (img, title,..) в попап на JS/JQuery?

Пробую с изображением, но у меня не выходит



P.S.: Спасибо за помощь

Comments

[Ankhena]

Вам нужно сначала получить src от текущего изображения.

$('#product-btn .popup-content').html('<img src="'+$(this).attr('src')+'" />');

- тут this это кнопка на которую кликнули, а у неё нет атрибута src.
Ну хотя бы так

$('#product-btn .popup-content').html('<img src="'+$('.card-img img').attr('src')+'" />');

[Алексей Алексеев]

Ankhena, Лучше наверное получить картинку текущего блока .card

$('#product-btn .popup-content').html('<img src="'+ $(this).closest('.card').find('img').attr('src')+'" />');

[Никита]

Ankhena, спасибо

[Никита]

Алексей Алексеев, и вам спасибо)

[Никита]

Алексей Алексеев, не подскажете, в чём будет заключаться разница при использовании первого или второго метода в случае, если карточек несколько?

[Ankhena]

Никита, в том, что в первом случае, у вас будет получаться всегда картинка из первого блока. А во втором из текущего.

Алексей Алексеев да, лучше

[Никита]

Ankhena, понял, спасибо ещё раз

Answer 1

[Дмитрий Марков]

Можно создать кастомный ивент и по открытию модалки тригерить его. В этот ивент передаёшь данные карточки, или другую инфу. А в прослушивании этого ивента сохраняешь/перезаписываешь объект карточки где нибудь.

Answer 2

[vladosgala]

Можно повесить onclick на каждую в вашем случае ссылку, с аргументом id либо другой уникальный ключ модели конкретной карточки.
Нужно ещё узнать где вы храните все модели данных этих карточек.
Если массив то, просто узнаём индекс елемента от уникального свойства модели.
И получаем всю модель данных для карточки.