WIP: Filters inside a component not supported

Browser: Brave v1.73.104 (latest) working on Chromium 131.0.6778.204
OS: macOS Sonoma

Radio and range filter won’t work if they are inside a component. Once I’ve unliked the component they worked fine.
Please check if you are able to reproduce the issue.
Thanks!

Hey @matutino,

thank you. I was able to replicate the issue with filters in general. I added it to our bug tracker.

Thanks,
Matej

1 Like

Hi @matutino,

We’ve fixed this in Bricks 1.12, now available as a one-click download from your dashboard.

Please let us know if you are still experiencing issues.

You can see the full changelog here: Bricks 1.12 Changelog – Bricks

Best regards,
Matej

Hello @Matej,

I’ve updated to Bricks 1.12 and now the issue is that I can’t connect the filter to the query loop as there are no results on the filter’s “Target query” dropdown setting. I tried to deactivate other plugins, to assign an ID to the query element and also to duplicate it, but had no luck.

You can see its behavior on this video: Bricks 1.12 filters inside component issue.mov - Google Drive

Hello @matutino,

you are right, this is still not working. Currently, you have to keep Query Filters outside of the components, so you will have to keep the setup as in your video (first example).

Thank you for understanding,
Matej

1 Like

Hey @Matej

Having some weird things with filters and having to resave, save, etc. especially when using ACF. I’ve got them to work, with media, on a media library, but it took many refreshes and toggles to get them to kick in correctly.

On a fresh install, I am trying to use a filter outside a component, but it’s seeming to not be working at all. Is this expected even when I’ve chosen the query loop inside the component?

Setup in Bricks - filter outside component set to the query inside it:

Frontend, no options given for the locations (despite them existing and showing up on the cards):

Thank you

Hi @robp,

This will not work. You can only connect filters to the components, where the query loop is on the root element and it will not work, if the query loop is inside one of the nested elements in the components.

Hope that explains it,
Matej

@Matej I think so mate. So basically we can’t use filters outside components, for queries inside them? Unless the component ITSELF is the query?

I mean that really defeats any benefits of using the components given the limitations there.

1 Like

@Matej Or do you mean, we can’t use filters at all in components?

Because even when I move it inside one, it doesn’t seem to work?

Hi @robp, sorry for late response! :face_holding_back_tears:

It’s like that:

  • Query filters should never be placed inside the component. Query filters should always be their own element
  • Query filter can only connect to the component query loop, if the query loop is defined on the main element of the component.

Those two things should be supported, so

yes, that’s right.

and yes to that as well. Filters can’t be placed inside the components and can’t taget queries that are inside the components.

I know this is not the answer you wanted to hear, but I hope I’ve cleared any dilemma.

Thank you,
Matej

1 Like

Thanks @Matej - legend.

It’s super limiting without filters in components sadly - is this on the roadmap?

Many thanks

Ok, let me be honest here and say that I don’t know the exact technical reason why this is not implemented, as I was not working on this feature, but it’s definitely something that we were already checking out and have a task opened for.
However, as far as I know, there is some complicated logic behind preventing this from working this way. Mostly because each filter needs to be unique, which is not the case if used inside components.

If we have an update on this, we will post it here; however, I can’t promise anything for now.

Best regards,
Matej

2 Likes

Appreciate the honestly Matej.

I can see the possible issue with it, but it’s a shame when you’re trying to build component first logic that you can’t use them for areas like that, given you’re likely to need grids and filter areas above all else to be component-ised.

3 Likes

I’m currently stuck building my customer website because Query Filters don’t work when the Query Loop is inside a component… Even when the filters and the loop are in the same component (and the query is passed as property). It’s really important that filters fully work with components, as this is essential for building reusable layouts…

I hope a solution can be found quickly, because duplicating my setup on every taxonomy archive page is really not the right way to do it

1 Like

Well as for now, this still holds:

Best regards,
Matej

I really hope a reliable components integration becomes top priority and not the 10th implementation of a feature, that’s already available as plugins, taking away a noticeable portion of dev time to polish components and a professional workflow.

It seems that Elementor and Divi users are the wanted users, when looking at the roadmap. Thus, such quality of live improvements have a lower priority.