How to use a Select on a Collection?

Hi, I’m trying to use a select element, loading a specific field from a collection (want to show all the customers’ names).

I follow indications I found on documentation, using function rollup as indicated, but I keep getting this error:

If I only bind the collection, without the formula, I do not get the error but then list is empty. How do I load a collection into a select?

Thanks

Hi @Francesc :wave:

Thanks for your question, it inspired me to record a new video tutorial on the topic!

It covers:

  • how to bind the select options to a separate collection (not your use case but thought I’d show it anyway!)
  • how to use the rollup formula to create a list of options if you don’t want to load a separate collection (hopefully that answers your question!)
  • how to add a frontend filter so the select filters through the collection based on the select component variable

Does that help? Don’t hesitate to let me know if anything is still unclear :slight_smile:

2 Likes

It works. First it did not , when typing the formula name (no type mismatch) but, when I picked it up from the formulas part, it worked

I have a twist. My collection is composed by hours logged by freelancers. One field of the main table (hours) is project id, which is linked to project tables, and from there to customers table, where the customer name finally is.

My collection has all the joins, and I can show data from any of the 3 tables in the table. BUT, when I go to filter by customer name, the option filter only shows filed from the main table; I cannot select the customer name, which is on the joined one

But the name is there

Great video thanks @Joyce! I just implemented this.

1 Like

I added ‘sort’ to the formula so that the select list values are in alphabetical order:

image

2 Likes

Nice touch! Well done, @Dorian :clap:

1 Like

Got it!

2 questions:

  1. What was your rationale for adding the info of the project_data and customers to the Freelance_Hours collection instead of creating 3 separate collections and using the lookup formula in WeWeb to link the 3?

There’s no right or wrong answer, just curious as to your reasoning because the solution I have to offer may involve having those 3 collections in WeWeb but I would prefer to avoid loading the same data twice if I can avoid it :slight_smile:

  1. Would you mind if I had a look at your project and created a test page to try things out?

If you don’t mind, can you send me the link to the project in a direct message and, if needed, the login details for a fake user to test things out? If it’s not possible, I’ll try to recreate a similar use case on my side, no worries. Just thought it might be easier to try with your specific setup :slight_smile:

Hi Joyce. Sorry for the late answer, but I’m travelling in Argentina and been off the grid for few days.

Answer to question 1 is because I did not know better :slight_smile: I did not know I could join the collections in WeWeb and thought data had to come from Xano. I’m doing my best but still a rookie. That was the only reason.

I’ll send you the connection details in DM

Haha it’s not necessarily a bad approach :slight_smile: Just wanted to make sure it wasn’t intentional in case the only solution I find requires the 3 collections and lookup approach.

Thanks for the DM. I’ll take a look asap!

Alright!

This will do the trick on a collection that is not paginated in the frontend (instead of using the “Filter” toggle, you use the filterByKey formula:

If you try this in your project @Francesc, you’ll see it works for a couple of customers (the ones that appear in the first 100 items of your collection. This is because your collection is paginated, which is a good thing because you don’t want to render too many items on the same page.

All this to say I need to think about your use case some more :smile:

Would it be ok with you if I created a dummy page in your project to test out some things?

1 Like

Wow! I would be honored if you play around!! This will be an internal tool, not a customer one, so freelancers can log their hours and we can pay them and bill customers easily. So there is no rush.

In addition, I’m traveling again abroad until end of July to Mozambique with very bad internet connection, so I might be disconnected a bit (my day job is at Medecins Sans Frontières). So honored to have your help but no need to rush.

Thanks again

1 Like

Awesome! Thanks for letting me know it’s not urgent, really appreciate it! :hugs: In any case, it’s on my to-do list to find one or two viable solutions for you :slightly_smiling_face:

2 Likes

Hey @Francesc :wave:

I’m heading out on vacation and won’t have time to look further into this before you get back :confused:

2 thoughts:

  1. you might find the solution for this in the new “Ticketing app” template that comes with the level 2 of the WeWeb academy. This video on backend filters and in particular around minute 14 might help

  2. if you’re open to sharing your work in public, it might be a great use case to work on with @flo and @Quentin during the next Office Hours

Hi Joyce, regards from Mozambique.

I will check the template as soon as I get back to civilization, early August.

Regarding the Office Hours, I do not know exactly what is it, but I would be honoured to share my work with weweb. My only problem is that, until my current commitment with Medecins Sans Frontières ends on March next year, my availability is quite hectic. I’m coming back from Moz on August 3rd and I’ve already been told I’m going back to Ukraine early September and Soudan after that.

But, if we manage to match agendas (and my proximity to a reliable internet connection), and I’m able to work a bit on my portal, I would love to get insights from you.

Enjoy your holidays and take a break, you’ve been a busy bee lately producing videos :slight_smile:

Francesc Box

1 Like