Forum | Appery.io

Hello Leo,

Use this code on event page show :

codecarousel = $('[name=mobilecarousel_7]');
carousel.on("ready", function(e) {
Appery("mobilecarousel_7").carouselRoot.carousel("to",2);
});/code

where mobilecarousel_7 is the name of your carousel

Yeah, that works! Thanks!

Hey,
i have tryed your solution now an really thought it would work. But sadly it does not. Internally the carousel jumps to the requested number, but the automaticly triggered "carousel refresh" is jumping right back to the old position.

Is this a bug?
Greetings
leo

Hi Leo,

What library version do you use (check in App Settings)? Are there any console errors?

Hey,
i am using version 2.0. There are no console errors. The code is valid, the carousel simply triggers the refresh a few times and jumps back to the old position so it seams it never moved to the new position in the first place.

The only interesting thing is, that during the carousel loading the refresh is triggered 5 times.

code
refresh: function () {
console.log("carousel refresh");
if (this.carouselRoot != undefined) {
this.carouselRoot.carousel("refresh");
}
},
/code

This procudes 5 console logs.
Greetings
Leo

Hi Leo,

Try the following:prevar carousel = $('[name=mobilecarousel_2]');
carousel.on("ready", function(e) {
carousel.off("ready");
Appery("mobilecarousel_2").carouselRoot.carousel("to",2);
});/pre

hi katya,

Basically, the code works fine (tried it in a new app).

The problem in our case is that we are loading five different lists from database into the five pages of the Carousel. Then it is not working. Maybe cause of the "refresh"? Any more ideas? (and we are using multi-page-template).

thanks,
martin

Hi Martin,

Please use this code to each of your carousel components:

pre

var NavigateCarouselTo = function(carouselName, page){
$('[name="' + carouselName + '"]').on("ready", function(e) {
$('[name="' + carouselName + '"]').off("ready");
Appery(carouselName).carouselRoot.carousel("to", page);
});
};

//For "mobilecarousel_32" carousel and 5 item.
NavigateCarouselTo("mobilecarousel_32", 5);

//For "mobilecarousel_33" carousel and 2 item.
NavigateCarouselTo("mobilecarousel_33", 2);

//For "mobilecarousel_34" carousel and 3 item.
NavigateCarouselTo("mobilecarousel_34", 3);

/pre

Regards.