Multiline dropdown?

I have a dropdown with very long choices:

Is there a way to increase the display width while in dropped-down mode (see pic)? [Less ideal]

Or, is there a way to show the choices as multiline? [More ideal]

NOTE: I need multiple and a dynamic number (inside a RG) of these per screen, so if there is a Group Focus solution…I am not sure how to make the “Reference element” be dynamic.

Since I posted this, I discovered the Reposition an element action!

Also, I read that putting both the Group Focus and the anchor element in a Reusable Element will work:

I have not tried these yet, but I do see a problem with the Group Focus approach…

How do I handle the case where the anchor element is close to the bottom of the window? See:

I highlighted the Group Focus while shown. As you can see it runs off the bottom of the page, and will not scroll into view. In this case, the anchor element is in a Floating Group:

Any thoughts on how to deal with this “edge case”? :wink:

I don’t have a direct answer for the question you are asking, but I had an aesthetic / UX suggestion - since these choices are so long, do they need to be in a dropdown? Your browser window in your example is wide enough to show most of it, but there’s no guarantees user’s windows will be that wide - or how the choices will appear on mobile.

What if instead of a dropdown, you used radio buttons? You can style the choices however you like more as blocks of text, with the radios next to each choice.

1 Like

@msgiblin Thanks! I’m always open to creative ideas…in this case, I have a user that is committed to the dropdown approach.

Any idea how I can keep my pseudo-dropdown Group Focus from drawing outside the window?

I know I could change the offsets with a condition, but I don’t know how to detect the edge of the window.

So to be frank, I haven’t done much with large dropdowns, so I’m really unable to give helpful advice on the Group Focus on that particular element.

That being said, since dropdowns are tied to the browser, I feel the more you do to customize a standard HTML dropdown, the higher the chance some other browser displays it different than you’re anticipating (and couldn’t possibly anticipate).

So if your user is committed to a dropdown (and I get that, I know what it’s like when you have a specification you can’t get around), have you considered building your own ‘dropdown’ with standard bubble tools, using a Repeating Group that expands when you click it, and then when you choose one of the cells, that is the cell displayed when the repeating group collapses. You could make it look and feel almost identical to a standard dropdown, but you’d have full control, and much more browser compatibility & testing ability depending on various screen sizes.

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