Multistage Form Mobile - Issue

Ask the community
,
1

I’m trying to disable the ability to swipe left and right to get to the next slide on a multi-stage form while on a mobile.

I have searched extensively and can’t seem to find an answer.

2

It is not possible. However, Code Queen already suggested a nice workaround:
When you detect that the slide has been switched without cliciking next ( onChange() ), switch it back by code ( changeSlide() ).
I’ve found out that if you make the elements on next slide elements hidden and collapsed by default (and show up only when the NEXT has been clicked) then all the automatic forth and back will probably be unnoticable to the user.

3

Thanks for the fast response, I’ve written up a quick function. It seems to detect the the slide change and the click event. But it doesn’t changeSlide back on the mobile.

export function slideshow1_change(event) {
if (NextButton_click) {
console.log(“Clicked”);
} else {
console.log(“Not clicked”);
$w(‘#slideshow1’).changeSlide(0);
}
}
4

It should be something like:

let nextClickValidator = 0;
export function nextButton_click(event) { 
 nextClickValidator = 1;
}
 export function slideshow1_change(event) { 
 if( event.target.currentIndex === 1 && nextClickValidator === 0){
  $w("#slideshow1").previous();
 }
}
5

I’ve implemented your code and I appear to be retrieving the correct values to register the previous slide action but it doesn’t execute.

Your code looks good to me. So I’m a bit confused on why previous() is not functioning properly.

Thanks for all your help already, J. D.

export function slideshow1_change(event) {
if (event.target.currentIndex === 1 && nextClickValidator === 0) {
$w(“#slideshow1”).previous();
console.log("Slide = " + event.target.currentIndex + " " + "Clicks = " + nextClickValidator);
}
}
6

it’s been a long time since i used it,
So I had another look at the documentation, and it says:
"The event handler set by the onChange function is run immediately before the slideshow moves to the new slide. Therefore, reading the slideshow’s currentIndex or currentSlide within the event handler function returns the index or slide that the slideshow is moving away from . "

So you cannot use my code as is. But you can do something like:

 export function slideshow1_change(event) { 
 if(nextClickValidator === 0){changeSlide(0);}
}
7

“It is run immediately before the slideshow moves to the new slide.” Doesn’t that mean my changeSlide() will be executing before the next slide action? So it will still transition to the next slide?

8

@brookmorpeth As I said it’s been a long time. I just remember it was easy, but maybe they’ve changed things since then. What you’re saying makes sense and you may need to add a short setTimeout() before you run the changeSlide() (but I don’t remember I had to do it…). You should play with it.

9
  • you may want to consider making your multi-stage form using boxes/stripes with collapse and expand instead of a slideshow. I find it easier and less limited (that’s what I do on my own site).