[support] refreshing jcarousel item list without page reload [SOLVED] (my problems)

Aldo Martinez Selleras aldo at caonao.cu
Fri Nov 19 19:02:13 UTC 2010


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




More information about the support mailing list