Hello,
Sorry because I’m a starter in Velo Code.
I have used this collapse exemple:
https://www.wix.com/code-examples/v2-collapsing
Using this tuto:
https://www.wix.com/velo/example/Collapse-Elements
With the same code:
function toggleFold(index) {
let $fold = $w(‘#fold’ + index);
let $arrowDown = $w(‘#arrowDown’ + index);
let $arrowRight = $w(‘#arrowRight’ + index);
// toggle the fold at the index
if ($fold.collapsed) {
$fold.expand();
$arrowDown.show();
$arrowRight.hide();
} else {
$fold.collapse();
$arrowDown.hide();
$arrowRight.show();
}
// collapse the other folds
[1, 2, 3, 4]
.filter(idx => idx !== index)
.forEach(idx => {
$w(‘#fold’ + idx).collapse();
$w(‘#arrowDown’ + idx).hide();
$w(‘#arrowRight’ + idx).show();
})
}
export function headerBox1_onClick(event) {
toggleFold(1);
}
export function headerBox2_onClick(event) {
toggleFold(2);
}
export function headerBox3_onClick(event) {
toggleFold(3);
}
export function headerBox4_onClick(event) {
toggleFold(4);
}
But with only 2 folders (1 and 2): The code on my page is:
function toggleFold ( index ) {
let $fold = $w ( ‘#fold’ + index );
let $arrowDown = $w ( ‘#arrowDown’ + index );
let $arrowRight = $w ( ‘#arrowRight’ + index );
// toggle the fold at the index
if ( $fold . collapsed ) {
$fold . expand ();
$arrowDown . show ();
$arrowRight . hide ();
}
else {
$fold . collapse ();
$arrowDown . hide ();
$arrowRight . show ();
}
// collapse the other folds
[ 1 , 2 ]
. filter ( idx => idx !== index )
. forEach ( idx => {
$w ( ‘#fold’ + idx ). collapse ();
$w ( ‘#arrowDown’ + idx ). hide ();
$w ( ‘#arrowRight’ + idx ). show ();
})
}
export function headerBox1_onClick ( event ) {
toggleFold ( 1 );
}
export function headerBox2_onClick ( event ) {
toggleFold ( 2 );
}
Fold1 and Fold2 values are checked “Collapsed” in the right panel
My troubles:
- Arrow doesn’t change from right to down
- On the exemple, when you click on Fold2, Fold1 hide.
When I click on Fold2, it shows but Fold1 doesn’t hide.
Typeerrors are:
$arrowDown.show is not a function
$arrowDown.hide is not a function
Here is a copy of the (bad) result.
Can someone help me please?