Expandable Text Box Code Issues

Ask the community
,
1

I followed the tutorial and have gone over several peoples input in this forum and I can not get the code to work. The site is not published yet but when I go into preview mode, the text box does collapse as it should. However, when I click the “Show More” button it doesn’t respond at all. I would greatly appreciate someone checking out my code.

let fullText;
let shortText;
$w.onReady( function () {
const shortTextLength = 918;
fullText = $w(“#text8”).html;
shortText = fullText.substr(0, shortTextLength) + “…”;
$w(“#text8”).html = shortText;
});
export function button2_click(event, $w) {
if ($w(“#text8”).html.length < fullText.length) {
$w(“#text8”).html = fullText;
$w(“#button2”).label = “Show less”;
} else {
$w(“#text8”).html = shortText;
$w(“#button2”).label = “Show more”;
}
}

2

Hi,
Can you try to use the text property instead of html?
Shortening the html value can make it corrupted.
For example, if the full html is “

this is my very long text

”, you might shorten it to “

this is my very long text</…” which is invalid

3

Hey Tomer. Thanks for your response. I figured out what I did wrong. I skipped the step where I needed to go into the Properties menu and add the property to the button. It is working fine now. I actually used the html and not text because it was cause an error where additional letters were being added. I think it was “space holder text” or something like that. Someone else in the forum suggested using hmtl and it solve the problem.

Cheers