How to disable a function after clicking on a button ?

Ask the community
,
1

Hello,

I would like to know how to disable a function in the code after clicking a button, and reactivating it after clicking on another one.

Here is what I’m trying to do :

  • I have an infinite loading script on a repeater page, so as the user scrolls down, it will automatically load more items

  • I have a ‘go to top’ button and a ‘go to footer’ button

  • I want the user to be able to access the footer if he clicks the ‘go to footer’ button, by doing so, it needs to disable the infinite loading script

  • The infinite loading function would be enabled again as the users exits the footer

Here is the infinite loading script (triggered everytime the user reaches the line under the repeater)

export function line12_viewportEnter(event, $w) {
	
	//shows 'loading more items' text message
	$w('#text73').show();
	
	//automaticly loads more items upon reaching the bottom of the page
	$w("#dynamicDataset").loadMore()
      .then( () => {
      console.log("Done loading more data");
    });
}

Thank you !

2

Hi,
How about creating a boolean global variable and insert it as condition the function that loads more data from the dataset.

 let loadMore = true;
 function scrollDown() {
     loadMore = false;
     scrollToFooter(); 
     setTimeout(() => {
         loadMore = true;
     },2000);
 }
 
export function line12_viewportEnter(event, $w) { 
//shows 'loading more items' text message 
    if (loadMore) {
        $w('#text73').show(); //automaticly loads more items upon reaching the bottom of the page 
        $w("#dynamicDataset").loadMore() 
        .then( () => {       
            console.log("Done loading more data"); 
        });
    }
}

What do you think ?
Roi

3

Hi, thanks a lot but it doesn’t work, it shows an error on :

scrollToFooter();

4

Hi,
I’ve should of write a comment that it’s a scrollToFooter() is a pseudo code.
You need to use scrollTo method.
Roi

5

Hi,

I can’t find any ScrollTo function.

Can you please perhaps provide with the bit of code ?

6

Hi,
Here you have scrollTo function with an example.
Good luck!
Roi

7

Thanks a lot !

I made some research and tweaked it a little and I managed to achieve what I was trying to.

8

Great!

9

Here is the code for those who want :

//goes to footer upon clicking the button and disables autolaod
let loadMore = true;
export function button33_click(event, $w) {
     loadMore = false;
     wixWindow.scrollTo(0, 9999);
     setTimeout(() => {
         loadMore = true;
     },2000);
 }

     
export function line12_viewportEnter(event, $w) {
	//automaticly loads more items upon reaching the bottom of the page 
    if (loadMore) {
    //shows loading message and then loads more items
        $w('#text73').show(); 
        $w("#dynamicDataset").loadMore() 
        .then( () => {       
            console.log("Done loading more data"); 
            //hides 'loading more' text message after successful loading
            $w('#text73').hide();
         });
    }
     else {
     	//hides the 'loading more' message if there is no item left to load
         // I couldn't find a way to display a "no more results found message
         //instead
     	 	$w('#text73').hide();
        }
}

Just one comment Roi, what is the setTimeOut purpose here ?

10

It’s a hacky way to reset the loadMore to true so the next time you scroll down it will try to load more.
Roi