# Filter elements for a many2many database

**URL:** <https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394>\
**Category:** How do I?\
**Created:** [September 17, 2023, 12:05am UTC](https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394 "2023-09-17T00:05:02Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![myb1001](https://avatars.discourse-cdn.com/v4/letter/m/34f0e0/32.png) [@myb1001](https://community.weweb.io/u/myb1001)\
**Post date:** [September 17, 2023, 12:05am UTC](https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394/1 "2023-09-17T00:05:02Z")

</div>

Hi there !

I am very new to WeWeb but building my app has been pretty smooth so far, but I have this “How do I do this” question about filtering my elements in a many-to-many database (using supabase here)

Let’s say my db looks like this :

book\_list  
id:1 - name:book1 - pages:563  
id:2 - name:book2 - pages:336

type\_list  
id:1 - name:manga  
id:2 - name:fantasy  
id:3 - name:action

book\_type:  
id:1 - book\_id:1 - type\_id:1  
id:2 - book\_id:1 - type\_id:3  
id:3 - book\_id:2 - type\_id:2

So basically : book1 is an action manga and book2 is fantasy, I hope you get the idea.

Now in WeWeb I have my Collection List items set to “book\_list”, which allows me to display all my books and the amount of pages, great !

I have also created a multiselect element, linked to my type\_list collection, with something like this : rollup(type\_list,“name”,“distinct”) to get all the different types (in this case manga fantasy and action).

But now, how do I actually filter my elements from my Collection List using the user selection from my multiselect ? In the filter form from the item collection I only have access to the rows from my book\_list collection.

Thank you very much

---

<div class="post-metadata">

**Author:** ![Broberto](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/broberto/32/5918_2.png) [@Broberto](https://community.weweb.io/u/Broberto)\
**Post date:** [September 17, 2023, 7:03am UTC](https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394/2 "2023-09-17T07:03:42Z")

</div>

Option 1. Set a where filter in the supabase plugin, and bind it to is equal to your select and the equivalent value. Select ignore if null. Then on change of the fetch the collection.

Option 2. Filter it via WeWeb, there is a tutorial somewhere, it’s fairly simple

I may have misunderstood though, could you provide more info?

---

<div class="post-metadata">

**Author:** ![Broberto](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/broberto/32/5918_2.png) [@Broberto](https://community.weweb.io/u/Broberto)\
**Post date:** [September 17, 2023, 7:29am UTC](https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394/3 "2023-09-17T07:29:24Z")

</div>

Okay, so I read your post again, and you have two options, as currently, the Supabase Plugin is not very practical in some aspects, one of which is filtering foreign key relationships.

1. Set references in your tables, you have book\_type.book\_id, make it bound to book.id and the same for type\_id
2. I have the following tables, similar to yours, I have job, job\_auto and auto, they’re bound via auto\_id and job\_id in the job\_auto, so check the structure out

 ![Screenshot 2023-09-17 at 09.12.27](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/b/be112a77b870acf040d3890a265c6cf24d4ee0e1.jpeg)

1. Go to SQL, and create a VIEW, via a JOIN of the two tables like this, it’s all explained in the code snippet bellow

 ![Screenshot 2023-09-17 at 09.26.52](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/1/178144d10f0013cb21e3b7ad14b88c30e0677f66.png)

```plaintext
CREATE VIEW many_to_many_join -- Your View Name
AS
select auto.name, auto.model, job.address, job.city -- Your desired columns from each joined table
-- Here begins the JOIN tables part, so you're selecting FROM joined table ..
FROM auto -- This is the first table, in your case would be book_list
join job_auto on auto.id = job_auto.auto_id -- Now you join it with your intermediary table, book_type, on book_type.book_id = book_list.id
join job on job.id = job_auto.job_id -- Now you join the intermediary table with your other table type_list, book_type, on book_type.type_id = type_list.id

```

1. Now you can query the joined table via you Supabase Plugin, and filter it via the two ways I gave you above.

 ![Screenshot 2023-09-17 at 09.16.52](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/1/1689215dc5a34f3ede99bda53f64a0eebbced7ab.jpeg)

So far this was the simpler approach, you can make this happen in supabase plugin as well, following the [PostgREST guide here,](https://postgrest.org/en/stable/releases/v09.0.0.html?highlight=join#resource-embedding-with-top-level-filtering) I’ve done it, and it’s terrible, even though very powerful. If you’d be interested in this guide as well, just say so, I’m not gonna be writing it now, because it’s very complicated.

---

<div class="post-metadata">

**Author:** ![Broberto](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/broberto/32/5918_2.png) [@Broberto](https://community.weweb.io/u/Broberto)\
**Post date:** [September 17, 2023, 7:33am UTC](https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394/4 "2023-09-17T07:33:47Z")

</div>

Also, a tip for the future, you might want to name your tables a little better, for book\_list I’d go with book, and for type\_list I’d go with type, unless you already have a type and a book somewhere. It’s a convention, that would make you for example write those querries faster and it’s more natural. You might want to check this course out, it helped me a lot in the beginnings. This guy is amazing.

[![](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/a/a4134bec9b1a29e88f3f3d0aa2ccb39ef343f215.jpeg "Database Design Course - Learn how to design and plan a database for beginners") ](https://www.youtube.com/watch?v=ztHopE5Wnpc)

---

<div class="post-metadata">

**Author:** ![myb1001](https://avatars.discourse-cdn.com/v4/letter/m/34f0e0/32.png) [@myb1001](https://community.weweb.io/u/myb1001)\
**Post date:** [September 17, 2023, 9:59pm UTC](https://community.weweb.io/t/filter-elements-for-a-many2many-database/4394/5 "2023-09-17T21:59:56Z")

</div>

Thank you very much for the detailed answer and the tip. Greatly appreciated
