Creating an expandable text box with a "show more..." in a Repeater

Ask the community
,
10

@dainis-locans That would be a different implementation but same idea, here how it would look like:

let fullText; // variable to hold the full text
let shortText; // variable to hold the short version of the text

$w.onReady(function () {
 const shortTextLength = 40;
    fullText = $w("#text1").text
    shortText = fullText.substr(0, shortTextLength) + "...";
    $w("#text1").text = shortText;

    $w('#repeater1').forEachItem(($w, itemData, index) => {
        $w('#button1').onClick((event, $w) => {
        if ($w("#text1").text === shortText) {
                $w("#text1").text = fullText;
                $w("#button1").label = "Show Less";
            } else {
                $w("#text1").text = shortText;
                $w("#button1").label = "Show More";
            }
        })
    })
});

Best
Massa