Dynamic dropdown list with pictures

General Q&A
1

Is it possible to make a dynamic list in which the user can select one element and the items will have pictures (not icons)?

  • Object-dropdown doesn’t support pictures/icons at all.
  • There are about 15 items, so a List isn’t a working solution (because it takes too much space).
  • I also tried typeahead component, but it doesn’t support pictures, just icons.

I would be grateful for any advices on how to implement this.

2

At the time of writing this, the only repeatable component that supports images is <list>.

What you could do in your case is limit the number of items shown to 5 items and build in your own pagination buttons (above or below the 5 items) that move through 5 items at a time. Next, you could add a text field in addition that the user could use to filter down the options.

3

As of runtime version 4.84.0, you can set a limit and controls attribute on list to display fewer results on a page and allow users to paginate. See the syntax reference for more information.

4

Thanks for the update!

Unfortunately, it doesn’t work on runtime version 4.83.6. I’ve added controls and total attributes to the list tag, but it says ‘Invalid attribute’ for both and there are no visual changes in the app.

5

Correct, the limit and controls attributes for list are only available on runtime version 4.84.0 and greater.

1 Like