Change out multiple datasets on page with animation.

Ask the community
,
1

I have 10 buttons that represent weeks. When clicking on the Week 1 button I have this click event:

export function button2_click(event, $w) {
$w(“#repeater1”).show (“SlideIn”);
}

The click event is tied to the repeater which is connected to the dataset.

I have a second repeater.

I want to click on the second button and change out the data connected to second repeater.
So far I have been able to hide the first repeater when clicking on the second button with this:

export function button3_click(event, $w) {
$w(“#repeater1”).hide (“SlideOut”);
}

I have tried multiple ways to get the dataset from the second repeater to slide in after the button click using some if/else statements, but have not been successful.
Can someone please help/guide me?

1 Like
2

Seems like I got this to work with some workaround of repeating the code cycle. :
//Button for Robotics

export function button3_click(event, $w) {

$w("#repeater2").show("SlideIn"); 

$w("#repeater1", "#repeater3", "#repeater4").hide;

}

//Button for Adventure

export function button2_click(event, $w) {

$w("#repeater1").show ("SlideIn"); 

$w("#repeater2", "#repeater3", "#repeater4").hide;

}

//Button for Science

export function button4_click(event, $w){
$w(“#repeater3”).show(“SlideIn”);

$w("#repeater1", "#repeater2", "#repeater4").hide;

}

//Button for Technology

export function button5_click(event, $w){

$w ("#repeater4").show("SlideIn"); 

$w("#repeater1", "#repeater2", "#repeater3").hide;

}

However,

Now I cannot seem to click back to load the slide-ins again.
I figured it is the way the script executes and I probably would need to tie it into a loop function.
Can someone help me with this?