Feature request: Container event handler / Clickable containers

I've been sitting on this wishlist item for a while, but the more I work with Mobile, the more I find myself needing it.

Currently, the only way to have a clickable container is via Custom Collections, as part of a repeat item. However, when I have a single item, I cannot simply make a container clickable, unless I force it into an unneeded custom collection - and most often, in order to achieve this, I have to feed that custom collection a bogus array of one item.

I've been juggling this approach so far, until the other day when I found myself needing to have a clickable container inside a one-item custom collection, but without making all the elements in the custom collection clickable.

Here's the example layout:


In the screenshot above, the green area is a custom collection which serves several purposes:

  1. Allow for more control over the spacing and positioning of elements in it (as opposed to a normal List Collection)
  2. Allow for more flexibility in text styling (as opposed to a normal List Collection where the Title/Body/Caption text styles are forced)
  3. Simplify data references by providing a data object to the collection, which is then used to populate the inner elements via {{item.name}}, {{item.gate_number}}, etc. Without providing the data object to the collection, the individual elements would need to reference some other object or query and if that were to change (like if switching from a query data to a temp state value), I would need to go and update each element individually, instead of making the change once at collection level.

What I needed is to make the ETA shaded area clickable, so when pressed, it would allow the user to take certain actions, like entering a new ETA. Given the flow of the app in previous steps, I did not want for the entire green area to be clickable.

Naturally, I tried to add yet another custom collection inside the existing main custom collection. That didn't quite work and I spent quite a bit of time trying to figure it out, until I learned that custom collections inside custom collections are not supported.

There are also other scenarios where being able to make a container clickable without jumping through hoops and loops would be helpful:


Above, I have an exception message that alerts the user to an issue with an item. Ideally, the user would be able to click on it to see more details.

I considered implementing this as a button which does allow for event handlers, but as per some of the criteria above, I would have to give up flexibility over size/spacing/padding and text styling/alignment since buttons are also limited when it comes to those things.

Another example is when I wanted a larger area to act as a button, without restricting the user to "aim" for a certain icon or text and without having to manage the same event in multiple places:


Here, the user would be able to click anywhere on the container bounds to edit the article.

Again, for more control over the elements, I cannot implement this as a button, or even as an icon AND a button (with transparent background) to make them both clickable, for multiple reasons.

I had come up with the idea for this type of "button" as a workaround for the fact that screen actions icons do not have a hidden/visibility option, so I can't hide the "Edit article" option from some users with certain, more restrictive roles.

So these are just some examples where the ability to simply set an event handler for a container would make life so much easier.

I'll be happy to provide further insights as needed.


+1 to all the above!

1 Like

I came across some screenshots from the iOS Health app and I couldn't help notice how "buttons" are implemented:

In Retool Mobile, this "look" or layout for buttons could easily be achieved as containers (with attached event handlers), giving full control over all the elements: text size/color/position, overall padding, icon display/position/size/color, etc.

Food for thought :slight_smile: .

For the sake of it, I recreated some of those elements in Retool:

Now, if only we could make those containers clickable.... :thinking:

+1, would be useful, especially on small devices and people wearing gloves

+1, I just came hunting to see if anyone else has ran into this issue, sure enough.

More versatile event handlers will be awesome.

Clickable containers should now be live in cloud! Should also be available in February's onprem release.


Can confirm It's live and very welcome.
Looks like icons too have had Clickable added

1 Like

That's great news, can't wait to try it out! Thank you!