PDA

View Full Version : Dynamic Carousel



rbaumannerb
27 Sep 2011, 8:23 AM
Is there a way to add items to a carousel dynamically? After a service returns data I create image links that should be displayed in a carousel. It's nothing fancy, and I can't seem to get additional items into the carousel. Here's sample code:



Ext.setup({
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
icon: 'icon.png',
glossOnIcon: false,
onReady: function() {
// Create a Carousel of Items
var carousel = new Ext.Carousel({
id: 'isaacCarousel',
ui: 'dark',
height: 205,
defaults: {
cls: 'card'
},
items: [{
contentEl: 'shelf1',
cls: 'htmlcontent'
},
{
contentEl: 'shelf2',
cls: 'htmlcontent'
},
{
contentEl: 'shelf3',
cls: 'htmlcontent'
},
{
contentEl: 'shelf4',
cls: 'htmlcontent'
},
{
contentEl: 'shelf5',
cls: 'htmlcontent'
},
{
contentEl: 'shelf6',
cls: 'htmlcontent'
},
{
contentEl: 'shelf7',
cls: 'htmlcontent'
}],
listeners: {
cardswitch : function() {
if(carousel.getActiveIndex() == 6)
setTimeout(function(){carousel.setActiveItem(0, {type: 'slide', direction: 'left'});}, 10000);
else
setTimeout(function(){carousel.next();}, 10000);
}
}


});

new Ext.Panel({
fullscreen: true,
layout: 'auto',
height: 500,
scroll: 'vertical',
items: [carousel, promoTopLine, promos]
})
}
});