Show comma-separated list and make items clickable to add to list

I have a data type “TOOLS”.

I want to show the list on a page like:

Tools: Tool1, Tool2, Tool3, Tool4, Tool5

The tools should be clickable and added to a list.

How can I do this?

Problems:

  • When I use a repeating group all columns will have the same width and I don’t get the comma-separated list that I want.
  • When I show them with a search and :each item’s Title I can’t make them clickable to add to a list

Any hint would be highly appreciated!

Hi @flyhigh, if you use the new responsive engine, your columns can adjust themselves to the right width

I use the responsive engine. But with that all columns will be the same width and I won’t get the look I need. Because the length of the tool’s names are different there will be white space everywhere.

Bildschirmfoto 2022-08-01 um 12.36.38

First row is done with a repeating group. Second row is what I want to have.

It should be possible to do with the chippify plugin. I use it for something similar on my page.

1 Like

There are actually a few ways to do this (using text elements or HTML elements with the Format as Text expression on the list)…

But, as @oliviercoolen points out, with the new responsive engine it’s now very easy to do with a RG…

Here’s how…

Have a RG with the following settings:

Add a text element inside the cell:

image

And here’s what you get:

Just add a workflow on click of the text within the cell to run whatever actions you need to run.

2 Likes

Fantastic, I must have had something wrong in the layout setting. Now it works. Thank you.

1 Like

Hi Adam, I have a follow-up question. When there are more items than fitting inside one must scroll horizontally. Is there a way to avoid that? I tried unchecking fixed number of rows but then everything was overlapping.

This is doing exactly what I want. I still try to figure out how to do it with just RG. But if I fail, I will use this little plugin. Thanks for the hint.

@flyhigh, were you able to figure out how to get your list to continue over multiple lines without awkward-looking spacing? My aim is to make the words in the ‘Expertise’ box below clickable.

Screenshot 2023-03-30 at 6.02.58 am