Solved: Dynamic product variants in choice component

Thanks to the brilliant @Jeff_Hager, we have now successfully implemented a dynamic product variant choice component. It was started from this discussion.

Based on this discussion and what Jeff and me worked on in the Sheets, I created an app that you can copy to work on for your own apps.

Basically you need to have:

  • A column that contains all sizes, separated by a comma (or you can change the separator in the formula if you have an existing one that is not a comma)

  • Determine the max number of different variants for a product and create the appropriate columns to store the size in an array column (e.g: Size 1, Size 2, Size 3, etc.)

  • Make another sheet to store the unique variants for all products. I have already solved that thanks to a combination of transpose, arrayformula, trim, split & textjoin.

  • Make a relation column in Glide that links the array column to the size array sheet and use that as your choice value.

The link to the app is here: https://hideous-seashore-9158.glideapp.io/

image image

8 Likes

The next step @ThinhDinh would be to get the value of each product variant.

E.g. The classic problem with a Pizza menu. Most cases, a pizza has 3 sizes (S,M,L) and each one has a different prices.

I had an idea to fix it but reading yours, I’d like to see your solution to improve this.

Gracias!

2 Likes

I guess I didn’t realize it, but I’ve been doing this (or something very similar) for a while in some of my apps. By using the same basic logic of moving all options to a separate sheet using “UNIQUE” formulas, I can then create a relation to the User Profile and then lookup the user’s specific choices so that only the ones that they’ve added to their profile are available. I use this for employees’ jobs… people at my organization can have more than one job title, so they’re able to add multiple jobs to their profile, then when they’re filling out a form, they have a choice component that only displays their jobs as choices.

2 Likes

Thank you @ThinhDinh for doing the legwork on this one.

1 Like

Thank you very much. That is what the shoe and shirt shop need it.

2 Likes

Hi @ThinhDinh,
Is this link dead?
Thanks
image

Si ! Yes

Yeah, this thread was 1 and a half years ago, I think I removed that app to clear my dashboard. Sorry for the inconvenience.

Anyone know where I can get a working example of this? Trying to figure this out for my grocery shop app.

Thanks!

Hey @ThinhDinh , I really need your help with this!

my app offers different types of food

Example:

Pizza (Options: Extra Cheese, Extra Veggies)
Ice cream (Options: Cone, Cup)

How am I supposed to assign different choices to different items?

thank you.

Sayam.

If row count is not an issue for you, you can add those options in an extra table and use a multiple-relation/filter for them to use in your choice component.

Something like:

Dish | Option
Pizza | Extra Cheese
Pizza | Extra Veggies
Ice Cream | Cone
Ice Cream | Cup

2 Likes

And if row count is an issue, then an alternative is to use a single row per dish, with a joined list of options:

Dish|Options
Pizza|Extra Cheese, Extra Veggies
Ice Cream|Cone, Cup

This case is a little more difficult to work with, but will save you rows.

2 Likes

I would definitely give this a try asap!

Thank you !! I really appreciate it :grin:

1 Like