Show more button for dynamic text box

Ask the community
,
1

This is the full code I used in my button but don’t know where it goes wrong kindly help someone

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;
$w(“#dynamicDataset”).onReady( function () {
fullText = $w(‘#dynamicDataset’).getCurrentItem().textField;
{
$w(‘#myTextElement’).collapse();
$w(‘#myButton’).collapse();
} else {
if (fullText.length <= shortTextLength) {
$w(‘#myTextElement’).text = fullText;
$w(‘#myButton’).collapse();
} else {
// create the shortened version of the text and display it in the text element
shortText = fullText.substr(0, shortTextLength) + “…”;
$w(‘#myTextElement’).text = shortText;
}
}
});
});

export function myButton_click(event) {
// display the full text
$w(“#myTextElement”).text = fullText;
// collapse the button
$w(“#myButton”).collapse();
// check the contents of the text element
if ($w(“#myTextElement”).text === shortText) {
// if currently displaying short text, display the full text
$w(“#myTextElement”).text = fullText;
$w(“#myButton”).label = “Show less”;
} else {
// if currently displaying full text, display the short text
$w(“#myTextElement”).text = shortText;
$w(“#myButton”).label = “Show more”;
}
}

2

That is because you have used the code for both the show more button and the show more/show less toggle.

You can’t use both options, you have to choose the one option and use that code only.

3

Code for the “Show More” Button using dynamic dataset instead of static text.

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

$w.onReady(function () {
$w("#dynamicDataset").onReady(function () {
// how many characters to include in the shortened version
const shortTextLength = 40;
// set the fullText variable to be the text from the collection
fullText = $w('#dynamicDataset').getCurrentItem().textField;
// if no text to display, collapse the text element and the button
if (!fullText) {
$w('#myTextElement').collapse();
 $w('#myButton').collapse();
} else {
// if the text has fewer or the same number of characters as shortTextLength characters, display it as is and collapse the "Show More" button
if (fullText.length <= shortTextLength) {
$w('#myTextElement').text = fullText;
$w('#myButton').collapse();
} else {
// create the shortened version of the text and display it in the text element
shortText = fullText.substr(0, shortTextLength) + "...";
$w('#myTextElement').text = shortText;
}
}
});

export function myButton_click(event) {
// display the full text
$w("#myTextElement").text = fullText;
// collapse the button
$w("#myButton").collapse();
}

You will need to make sure that you have matching pairs of curly brackets and parentheses too, which are the open { and closed } and the open ( and closed ), you need equal numbers for them hence the matching pairs.

4

Thank you for your input. I tried both the code individually but did’t work. Can you help me with the final code with proper parenthesis?