Owlcarousel2: Add item by Ajax in Carousel

Created on 6 Jan 2016  路  1Comment  路  Source: OwlCarousel2/OwlCarousel2

Hi,
I'm trying to add items by ajax.
I'm triggering this method "add.owl.carousel" for adding, but when i add item its giving this error "TypeError: content.find is not a function" at 1390 line.
What should I do .
My code

jQuery('#yyy).on(
'translated.owl.carousel add.owl.carousel', function(e) {
console.log(e.type);
if(e.item.count==e.item.index){
var pos = e.item.index;
jQuery.ajax({
type : "post",
url : ajaxurl,
async:false,
data : {'action': 'yfun', 'offset': offset,'width':c_width},
success: function(response) {
if(response!=1){
offset++;
$('#yyy').trigger('add.owl.carousel', [response,e.item.count]);
}
}
});
}
});
response coming in this format:

< li >< h 3 >C< / li>< li >< h3 >D< / h 3>< / li>

Please tell me what i missing here. I'm stuck for 1 day :(

Most helpful comment

2 things-

  1. it expects an jQuery Object hence jQuery('<div class="owl-item">' + html + '</div>')
  2. encapsulate each item's html with the <div calss='owl-item'> </div>

hence ur code will become-

$('#yyyy').owlCarousel().trigger('add.owl.carousel', [jQuery('<div class="owl-item">' + html + '</div>')]).trigger('refresh.owl.carousel');

>All comments

2 things-

  1. it expects an jQuery Object hence jQuery('<div class="owl-item">' + html + '</div>')
  2. encapsulate each item's html with the <div calss='owl-item'> </div>

hence ur code will become-

$('#yyyy').owlCarousel().trigger('add.owl.carousel', [jQuery('<div class="owl-item">' + html + '</div>')]).trigger('refresh.owl.carousel');

Was this page helpful?
0 / 5 - 0 ratings

Related issues

stratboy picture stratboy  路  3Comments

shamimsaj picture shamimsaj  路  3Comments

Laraveldeep picture Laraveldeep  路  3Comments

hopea114y picture hopea114y  路  3Comments

siwel picture siwel  路  3Comments