jCarousel ajax load on next button

Question

Я использую jcarousel для загрузки результатов поиска из нескольких слов в отдельных слайдерах.
Когда я нажимаю на следующую кнопку, на мой слайдер добавляются 6 элементов, но ползунок не прокручивается до тех пор, пока не будет сделан другой щелчок.
Где проблема?

var runSearchCarousel = function(){ 
     var carousel = jQuery('.row-wrap').jcarousel({vertical: false, animation: 'fast', visible: 4, wrap: 'last'}); 
     return carousel; 
    }; 

var searchCarouselMore = function(){ 

    jQuery('.search-row').on('click', '.next-b', function(){ 

     var $this = jQuery(this), 
     id = $this.attr('id').substring('rightArrow-'.length), 
     container = jQuery('#slider_' + id), 
     containerPosition = container.parent().parent().find('#rowPosition-' + id).val(), 
     lastLi = container.find('li.gridWrap').filter(':last'), 
     carousel = container.parent(), 
     lastSku = lastLi.attr('id').substring('product-'.length); 

     $this.jcarouselControl({ 
      carousel : carousel, 
      target : '+=4' 
     }); 


     jQuery.ajax({ 
      type: 'get', 
      url : '/ajax/_fetchMultiSearch.php', 
      data: { 
       toFetch: 6, 
       containerPosition: containerPosition, 
       lastSku: lastSku 
      }, 
      cache: false, 
      success: function(response){ 
       container.append(response); 
       uiResize(); 
       carousel.jcarousel('reload'); 
      } 
     }); 

    }); 

Answer 1

решаемые

var runSearchCarousel = function(){ 
    var carousel = jQuery('.row-wrap').jcarousel({vertical: false, animation: 'slow', visible: 4}); 
    return carousel; 
}; 

var searchCarouselMore = function(){ 
    jQuery(".prev-b").on("jcarouselcontrol:active", function() { 
     jQuery(this).removeClass("inactive") 
    }).on("jcarouselcontrol:inactive", function() { 
     jQuery(this).addClass("inactive") 
    }).jcarouselControl({ 
     target: "-=1" 
    }); 

    jQuery(".next-b").on("jcarouselcontrol:active", function() { 
     jQuery(this).removeClass("inactive") 
    }).on("jcarouselcontrol:inactive", function() { 
     jQuery(this).addClass("inactive") 
    }).jcarouselControl({ 
     target: "+=1" 
    }); 

    jQuery('.search-row').on('click', '.next-b', function(){ 

     var $this = jQuery(this), 
     id = $this.attr('id').substring('rightArrow-'.length), 
     container = jQuery('#slider_' + id), 
     containerPosition = container.parent().parent().find('#rowPosition-' + id).val(), 
     lastLi = container.find('li.gridWrap').filter(':last'), 
     carousel = container.parent(), 
     lastSku = lastLi.attr('id').substring('product-'.length); 

     $this.jcarouselControl({ 
      carousel : carousel, 
      target : '+=4' 
     }); 


     jQuery.ajax({ 
      type: 'get', 
      url : '/ajax/_fetchMultiSearch.php', 
      data: { 
       toFetch: 6, 
       containerPosition: containerPosition, 
       lastSku: lastSku 
      }, 
      cache: false, 
      success: function(response){ 
       container.append(response); 
       uiResize(); 
       carousel.jcarousel('reload'); 
      } 
     }); 

    }); 

    jQuery('.search-row').on('click', '.prev-b', function(){ 

     var $this = jQuery(this), 
     id = $this.attr('id').substring('leftArrow-'.length), 
     container = jQuery('#slider_' + id), 
     carousel = container.parent(); 

     jQuery(this).jcarouselControl({ 
      carousel : carousel, 
      target : '-=4' 
     }); 
    }); 

};