Get the same button to open and close a container box

Ask the community
,
1

I have the following code

export function button19_click(event) {

    $w( '#columnStrip15' ).expand() 
$w( '#box3' ).expand()

}

When the button is clicked for the second time I want it to close the box and the strip. How do I do this?

2

Try this:

exportfunction button19_click(event) {
if ($w('#columnStrip15').isVisible || $w('#box3').isVisible()) {      
$w('#columnStrip15').collapse()    
$w('#box3').collapse()
}else{
 $w('#columnStrip15').expand()    
$w('#box3').expand()
}
3

on line 15 I am getting a error - ‘isVisible’ is a member but used as function. Can you advise?

945×489 21.6 KB

4

oh remove the ‘()’
change:

$w('#box3').isVisible()

to this:

$w('#box3').isVisible
5

You can also try this -

let isVisible = false;

export function button17_click(event){
    if(isVisible) {
        // Collapse the items you want
        isVisible = false
    }else {
        // Expand the items you want
        isVisible = true
    }
}
6

I dont understand. What would the whole code look like?

7

@okeyiwobi I have this now and the errors are gone.

Basically columstrip15 and box 3 are collapsed on load. When button 17 is clicked I want it to expand and then recollapse when clicked again.

8 
let isVisible = false;

export function button17_click(event){
    if(isVisible) {
        $w('#columnStrip15').collapse()    
        $w('#box3').collapse()
        isVisible = false
    }else {
        $w('#columnStrip15').expand()    
        $w('#box3').expand()
        isVisible = true
    }
}