Обновление данных в модальном окне
Добрый день. Использую bootstrap modal + slick slider, сейчас контент в модальном окне формируется динамически, одно модальное окно для всех элементов на странице. Контент состоит из изображения, описания и слайдера с похожими изображениями который формируется по data-value. Проблема в том, как обновить данные в модальном окне при клике на изображение в слайдере? Как к этому изображению подвязать контент?
JS код который сейчас используется
$(".mwrap").on("click", function() {
var img, desc, value, elements;
img = $("img", this).attr("src");
desc = $("p", this).html();
value = $("img", this).data("value");
elements = $.map($('img[data-value="' + value + '"]'), function(img) {
return $("<div/>", {
html: $(img).clone()
})
})
$(".wimg").attr("src", img);
$(".wdesc").html(desc);
$(".wslider").html(elements);
});
$("#myModal").on("shown.bs.modal", function() {
$(".wslider").slick({
dots: true,
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true
});
$('html').removeClass('.hide-slider');
});
$("#myModal").on("hide.bs.modal", function() {
$(".wslider").slick('destroy').html("");
})
Пример работы скрипта http://bogdan.tw1.ru/works Большое спасибо гуру js:) |
Попробовал использовать функцию onclick()
<a onclick="openmodal(2)">Anchor text</a>
function openmodal(id){
var id = id;
var img, desc, value, elements;
img = jQuery("img[data-content='" + id + "']").attr("src");
desc = jQuery("p[data-content='" + id + "']").html();
jQuery('#myModal').modal('show');
jQuery(".wimg").attr("src", img);
jQuery(".wdesc").html(desc);
}
Удалось обновить содержимое, но вот запустить слайдер не вышло |
| Часовой пояс GMT +3, время: 15:29. |