Hello,
I'm using the carousel component on an app. I have discovered that when an API is called from one of the carousel frames, the carousel automatically gets back to frame number 1. The API request is performed correctly, but instead of staying on the current frame, it always gets back to the first frame.
Any hints on how to solve this?
Thank you very much
Hello! Could you describe in more details how did you implement it? Please also you post code you use.
Hello, Maryna
I'll try to explain. My carousel has 3 frames. On the third frame I have three buttons. Whenever the user clicks on any of the buttons, an event is executed consisting on making an API request and displaying some text provided by the API.
The thing is that when I click on the buttons (and the API is called), the carousel automatically goes back to frame number 1. If I navigate to frame 3 again I see that the API has been called and the text has been displayed correctly.
Most likely while testing you click on invisible div
pre<div class="ui-left-arrow"></div><div class="ui-right-arrow"></div>/pre Please delete them using CSS
We have discovered that by clicking on the button that triggers the API request, the following function is executed:
(ApperyJS, line 2437)
refresh: function () {
console.log("carousel refresh");
if (this.carouselRoot != undefined) {
this.carouselRoot.carousel("refresh");
}
},
This function refreshes the carousel, therefore redirecting the user to the first slide.
Is there anyway to avoid this refreshing?
Thank you!
Hi,
Use the following:prevar carousel = Appery("mobilecarouse");
carousel.refresh();/preWhere mobilecarouse is a Carousel component name.