Forum Academy Marketplace Showcase Pricing Features

Adding an ellipsis to truncated strings?

Hello. I am populating a dropdown menu from a list of text strings, some of which might be quite long. I am truncating the dropdown list items to 50 characters, but I would like to add an ellipsis to the end of strings that are truncated. I can easily add them to ALL strings, but some will be shorter than 50, so the ellipsis would be inappropriate.

Any ideas?

Hi @ixisnine,
I know this is a very dirty solution and others may propose more efficient one. But in the interim here you go:
So the idea is to store both the full text and the shortened text (formatted with the ellipsis) in the database.
Then when you’re populating your dropdown you use the shortened version.

The question is how do you create the shortened text. This is where i expect efficient ways than what i’m going to propose here.
My suggestion is to use a javascript expression. To do this you will first need to install the Toolbox plugin.
Then in your editor you add an expression (make sure to tick the checkbox).
Then you can now add your javascript expression that says that if the text’s length is less than or equal to 50, return the text, else get the first 50 characters and concatenate it with the ellipses. e.g.
“Input A’s value”.length <= 50 ? “Input A’s value” : “Input A’s value”.substring(0,50) + “…”
Here input A is where the text to be stored is.
NB: In case you’re not familiar with javascript i’m using the shortened/clean version of the if-else expression
See snapshot below

Then in the workflow that creates/modify a thing with your text field, you will include adding the shortened text field too.
See example below:

Again this may not be the optimal solution but it works. Normally i try to avoid using plugins as they may slow your application a bit but i haven’t been able to come up with any better solution without using javascript expressions.
I’m toying with another idea of using find & replace with regex; but this may just be me having a brain fart.

Happy bubbling :smiley:

3 Likes

Have you tried setting a conditional on the text that utilizes the number of characters count function? (Ie. if the “text” is 50+ characters, then text:truncated to 50 “…”)

Writing the expression may be a bit trickier since you’re using a dropdown. But I did a quick test and it seems like it should work.

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.