Initially:
1 needed to reload the list of objects within the carousel, to make a change in the options of a select.
2 then the list is regenerated, but was created a blank subject and this was in the first space
3 then when do it a scroll the item list was regenerated and did not move objects while retaining the total number unchanged, just change the images that showed
after be looking the sources of examples from sorgalla.com, in the " Carousel with dynamic content loading via Ajax" there is section like this!
if (state != 'init') return;
so, the final code is this
function mycarousel_itemLoadCallback(carousel, state){ if (state != 'init') return; var classification = $('#award-type-filter').val(); $.get( '/classification/' + classification, function(xml) { mycarousel_itemAddCallback(carousel, carousel.first, carousel.last, xml); }, 'xml' ); };
function mycarousel_itemAddCallback(carousel, first, last, xml){ carousel.size(parseInt(jQuery('total', xml).text())); //alert(last); $('image', xml).each(function(i) { carousel.add(first + i, mycarousel_getItemHTML(jQuery(this).text())); }); };
function mycarousel_getItemHTML(url){ return '<img src="' + url + '" width="75" height="75" alt="' + url + '" />'; };
Drupal.behaviors.cupcake_profile = function (context) { var carousel = $("#profile-carousel").jcarousel({ itemLoadCallback: mycarousel_itemLoadCallback, vertical: true, //wrap: 'circular' })
console.log(carousel); $("#award-type-filter").change(function(){ var carousel = $('#profile-carousel').data('jcarousel'); carousel.reset();
var xml = $.get('/classification/' + $(this).val(), function(){ $.each(xml, function(i, item){ carousel.add(i+1, item); }); carousel.reload(); //carousel.scroll(carousel.first); }); }) } And my callback function return a XML data like "Carousel with dynamic content loading via Ajax from a PHP script"
PERFECT, thanks a lot to Christopher, u are my savior :D