Custom Choice Component (pills) with Default Value outside of a Form /with a catch/

[RichardYM]

Hey, guys!

I’ve seen some people requesting a choice component with a default value outside of the Form screen/container. I had this exact case as well in one of my projects recently. And while I could work around it with a “required”, so only the first time a user logs in, the choice component is empty, I still didn’t like it.
/TL;DR at the end/

I started thinking and as to my knowledge, the Custom Code component is not stable yet. So I managed to craft a Custom component with HTML and some backend logic. I then put it into a Custom Collection and with Glide /item/ actions you can switch the choices as in a normal Choice component.

While it works, there is one big catch - I’m using absolute position within the HTML to make it work properly.

The whole structure is the following:
HTML and backend logic → Rich-text component, which is put into a Custom Collection to show the choices.

2 caveats to this:

1. You can only have up to 3 choices (depending on the length of the name) within a collection /afterwards, you have to get creative to add more on a second, third row, etc/.
2. The absolute position needs some tweaking to make it work properly with the other components.

I know it’s a headache of a solution, depending on the use case. In my case I have only 2 choice options, so it works great.

I’ll share 2 pictures showcasing it. If there’s further interest, I will attach a whole video on how it works, how you can build it, etc.

TL;DR
Custom Choice Component (pills) created with HTML to have a Default Value. The rich-text is put into a custom collection. The use of the custom collection leads to having to use absolute position within the HTML. Absolute position on the other hand leads to some problems which require tweaking in order to make it work for your use case.

[ThinhDinh]

Dynamic URL

You could try adding a form container and set the default value of a text entry component with get part of url to a user specific column. Then take text entry component out of the form container and finally delete form container. Just make sure source of form container is same as screen. You should be left with a user specific column that automatically sets itself with the parameter from the url. @Jeff_Hager have you tried it?

Here’s an alternative. The caveat is after moving the text entry out, you hide it with a condition that will never be true, and then add the choice component pointing to the same column.

[RichardYM]

Amazing! Didn’t find that post when I was searching for the Default value haha.

That’s a nice catch from @Eric_Penn

In my use case I had to work around the fact that text entry doesn’t accept user specific columns if the form’s target table is from a Spreadsheet. (very weird in my opinion)

Anyways, thank you for the suggestion. It’s way more efficient than what I made haha

[ThinhDinh]

No worries, thanks for the share!