Owl-carousel 2 добавление слайдов через each
Привет!
Версии: owl.carousel.2.0.0-beta.2.4 jquery 2.2.4 У меня есть такая задача: //Тут выводится карусель <div id="car-photo-carousel" class="owl-carousel"></div>
//Выбираю машину
$('#car_id').on('change', function (e) {
var car_id = e.target.value;
//Инит карусели
var carousel = $('#car-photo-carousel');
carousel.owlCarousel({
autoplay:true,
autoplayTimeout:3000,
autoplayHoverPause:true,
items : 3,
responsiveClass:true,
nav:true,
navText: ["<i class=\"fa fa-chevron-left\" aria-hidden=\"true\"></i>","<i class=\"fa fa-chevron-right\" aria-hidden=\"true\"></i>"],
responsive:{
0:{
items:1,
nav:true
},
400:{
items:2,
nav:true
},
768:{
items:3,
nav:true
}
}
});
//Тут делаю AJAX запрос, получаю список объектов
$.post('/admin/getmodels/car', {car_id: car_id}, function (car) {
if (car.photos.length > 0) {
var counter = 0;
//У объекта есть фотографии, они выводятся и добавляются через append к DIV, проверял все работает 100%, но мне надо добавить их к слайдеру, ок добавляем?
$.each(car.photos, function (index, photo) {
counter++;
var content = '<img class="img img-responsive" src="' + photo.file + '"/>';
carousel.data('owlCarousel').addItem(content,0);
});
} else {
//Или одна картинка без слайдера
carousel.append('<img class="cal-xs-8 img img-responsive" src="' + car.modelphoto[0].file + '"/>');
}
});
});
Тут получается что добавление происходит в другой функции и он не видит уже инициированного слайдера? Получаю ошибку: Uncaught TypeError: carousel.data(...).addItem is not a function Как лучше сделать? :victory: |
AnimalInstinct,
строку 5 перенесите в строку 1. или в строках 37 , 41 укажите селектор а не используйте переменную |
Сделал так, но пока получаю ту же ошибку Uncaught TypeError: $(...).data(...).addItem is not a function
$( document ).ready(function() {
$('#car-photo-carousel').owlCarousel({
autoplay:true,
autoplayTimeout:3000,
autoplayHoverPause:true,
items : 3,
responsiveClass:true,
nav:true,
navText: ["<i class=\"fa fa-chevron-left\" aria-hidden=\"true\"></i>","<i class=\"fa fa-chevron-right\" aria-hidden=\"true\"></i>"],
responsive:{
0:{
items:1,
nav:true
},
400:{
items:2,
nav:true
},
768:{
items:3,
nav:true
}
}
});
});
$('#car_id').on('change', function (e) {
var car_id = e.target.value;
$.post('/admin/getmodels/car', {car_id: car_id}, function (car) {
if (car.photos.length > 0) {
var counter = 0;
$.each(car.photos, function (index, photo) {
counter++;
var content = '<img class="img img-responsive" src="' + photo.file + '"/>';
$('#car-photo-carousel').data('owlCarousel').addItem(content,0);
});
} else {
$('#car-photo-carousel').append('<img class="cal-xs-8 img img-responsive" src="' + car.modelphoto[0].file + '"/>');
}
});
});
|
AnimalInstinct, строка 32
if(!$('#car-photo-carousel').data('owlCarousel')) $('#car-photo-carousel').owlCarousel({});
|
Не помогло
|
| Часовой пояс GMT +3, время: 13:21. |