What is this design element called and is it easy to create in Bubble?

[bubble43]

Hello!

I have a list and would like it to show similar to this where the user can click “X” to remove them, is this something easy to implement? I am not sure what it’s called so having a hard time searching for how to do it.

I am referring to the “What was great box” in the image.

Thank you!

[mikeloc]

Hi there, @bubble43… it looks like a multi-dropdown to me. You might want to consider installing Bubble’s multiselect dropdown plugin and see if it meets your needs.

Best…
Mike

[bubble43]

Hey @mikeloc , thank you for the response!

That helps a lot and is very close to what I am trying to achieve. However, I don’t want the dropdown piece, I just want the list of things to populate, and then the user can click the “X” to remove them.

I was able to set the list to the default value so on page load it displays as intended but I can’t seem to disable the dropdown list while still allowing a user to “X” any of them.

For example, it currently shows the below when I click on the box:

However, I only ever want to see the below and the user can remove items but not add or re-add:

Is that possible?

[mikeloc]

Ah, my bad… I assumed users could select the options as well as get rid of them. Have you tried just using a repeating group? I mean, you are just displaying a list of things, and you are removing a thing (which could be the current cell’s thing, if you use a repeating group) when the x is clicked. It would take some creative styling, but it should be totally doable.

[duke.severn]

Just to add to @mikeloc suggestion to use RG, here’s the scrolling style you may want to use.

[New Feature] Ability to create "tag like" list with Repeating Groups

Hello everyone! Very excited to announce the release of a highly requested feature - the ability to create a “tag like” list in Bubble (see image below). [Screen Shot 2022-09-01 at 2.07.03 PM] To build something like this, we’re introducing a new “Scroll direction” in Repeating Groups called “Wrapped horizontally.” This setting allows the repeating group to act like a row container in that instead of scrolling, the items in the list will wrap to a new row if the number of items in the list i…

[bubble43]

All good!

I figured using a repeating group would be the way to go about it, just wanted to see if there was an easier or prebuilt way. Looks like it’s time to get creative with styling.

Thank you!!

[bubble43]

This is awesome, thank you! Should make the styling piece a lot easier.